Skip to content

Commit f67019e

Browse files
Made changes to the content and added links.
1 parent 2e8400a commit f67019e

File tree

1 file changed

+14
-17
lines changed

1 file changed

+14
-17
lines changed

MAUI/DataForm/AI-Powered-Smart-Paste-DataForm.md

Lines changed: 14 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,34 @@
11
---
22
layout: post
33
title: AI-powered Smart Paste .NET MAUI Dataform | Syncfusion®
4-
description: This guide explores how to build an AI powered smart paste .NET MAUI SfDataForm by integrating Azure OpenAI.
5-
4+
description: Learn here all about how to build an AI powered smart paste .NET MAUI SfDataForm by integrating Azure OpenAI.
65
platform: maui
76
control: SfDataForm
87
documentation: ug
98
---
109

1110
# AI-powered Smart Paste .NET MAUI Dataform
1211

13-
This guide introduces the integration of AI-powered Smart Paste functionality into the .NET MAUI DataForm, enhancing user experience by automating data entry through intelligent clipboard parsing. Smart Paste is an AI-powered feature that automates data entry by intelligently pasting and organizing clipboard content into the correct fields of a form. It reduces manual errors and boosts efficiency, especially useful in scenarios like customer feedback forms, surveys, and registrations
12+
This guide introduces the integration of AI-powered Smart Paste functionality into the .NET MAUI [DataForm](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.DataForm.SfDataForm.html), enhancing user experience by automating data entry through intelligent clipboard parsing. Smart Paste is an AI-powered feature that automates data entry by intelligently pasting and organizing clipboard content into the correct fields of a form. It reduces manual errors and boosts efficiency, especially useful in scenarios like customer feedback forms, surveys, and registrations
1413

1514
## Integrating Azure OpenAI with the .NET MAUI app
1615

1716
### Step 1: Set Up the .NET MAUI Project
1817

19-
- Create a new .NET MAUI app using Visual Studio.
18+
- Create a new [.NET MAUI app](https://learn.microsoft.com/en-us/dotnet/maui/get-started/first-app?view=net-maui-9.0&viewFallbackFrom=net-maui-7.0&tabs=vswin&pivots=devices-android) using [Visual Studio](https://visualstudio.microsoft.com/).
2019
- Add the required NuGet packages:
2120
`Syncfusion.Maui.DataForm`
22-
`Syncfusion.Maui.AIAssistView` and `Azure.AI.OpenAI`
21+
`Syncfusion.Maui.AIAssistView` and [`Azure.AI.OpenAI`](https://www.nuget.org/packages/Azure.AI.OpenAI/1.0.0-beta.12)
2322

2423
### Step 2: Set up Azure OpenAI
25-
To enable AI functionality in your .NET MAUI DataForm, you need to set up Azure OpenAI. This service allows your application to process natural language prompts and generate intelligent responses for scheduling tasks.
26-
27-
Start by creating an Azure OpenAI resource in the Azure portal. Once the resource is created, deploy a model such as **GPT-35 model**, which will be used to interpret user input. Assign a deployment name to the model, which you’ll reference in your application code.
2824

29-
Next, retrieve the API key and endpoint URL from the resource settings. These credentials are required to authenticate and communicate with the OpenAI service from your app.
25+
To enable AI functionality in your .NET MAUI Scheduler, first ensure that you have access to [Azure OpenAI](https://azure.microsoft.com/en-in/products/ai-services/openai-service). In the Azure portal, create an Azure OpenAI resource and deploy a model such as GPT-35. Assign a deployment name (for example, GPT35Turbo) that you’ll reference in your application code. Finally, copy the API key and endpoint URL from the resource settings, as these are required for authentication and communication with the OpenAI service.
3026

3127
### Step 3: Connect to the Azure OpenAI
28+
3229
To connect your .NET MAUI app to Azure OpenAI, create a service class that handles communication with the AI model. Start by initializing the OpenAIClient using your Azure endpoint and API key.
3330

34-
In this service, define a method called **GetAnswerFromGPT**. This method takes a user prompt as input, sends it to the deployed model, and returns the AI-generated response.
31+
In this service, define a method called GetAnswerFromGPT. This method takes a user prompt as input, sends it to the deployed model, and returns the AI-generated response.
3532

3633
```
3734
/// <summary>
@@ -72,6 +69,10 @@ In this service, define a method called **GetAnswerFromGPT**. This method takes
7269
}
7370
```
7471

72+
```
73+
this.client = new OpenAIClient(new Uri(endpoint), new AzureKeyCredential(key));
74+
```
75+
7576
## Integrating AI-powered Smart Paste in .NET MAUI DataForm
7677

7778
### Step 1: Create the DataForm Model
@@ -266,7 +267,7 @@ In XAML, set up the form layout - including labels, images, dataform control. Ad
266267

267268
### Step 4: Implement Smart Paste Functionality.
268269

269-
The Smart Paste feature in enables users to quickly populate form fields using unstructured text copied to the clipboard. This functionality leverages Azure OpenAI’s GPT model to interpret the clipboard content and convert it into structured data that matches the form’s data model.
270+
The Smart Paste feature enables users to quickly populate form fields using unstructured text copied to the clipboard. This functionality leverages Azure OpenAI’s GPT model to interpret the clipboard content and convert it into structured data that matches the form’s data model.
270271

271272
To implement this, the application first checks whether the clipboard contains any text. If valid content is found, it constructs a prompt instructing the AI to convert the text into a JSON object that aligns with the FeedBackForm model. This prompt is sent to Azure OpenAI using the service class AzureOpenAIServiceConnector, which handles the connection and communication with the AI model.
272273

@@ -367,7 +368,7 @@ Once the AI returns a response, the application deserializes the JSON string int
367368

368369
### Step 5: Validate and Submit the form
369370

370-
Enable DataForm validation for all the fields during submission. If validation passes, display a confirmation message. If validation fails, show appropriate error messages.
371+
Enable DataForm validation for all the fields during submission using the Validate method. If validation passes, display a confirmation message. If validation fails, show appropriate error messages.
371372

372373
```
373374
private void OnSubmitButtonClicked(object? sender, EventArgs e)
@@ -390,11 +391,7 @@ private void OnSubmitButtonClicked(object? sender, EventArgs e)
390391
}
391392
```
392393

393-
![AI powered Smart Paste .NET MAUI Dataform](images/smart-ai-samples/ai-smart-paste-dataform.mp4)
394-
395-
By combining Azure OpenAI with the Syncfusion .NET MAUI DataForm, Smart Paste makes it possible to paste copied content directly into the correct fields. This integration reduces effort, increases reliability, and delivers a faster and smarter way to handle form-based data entry in .NET MAUI applications.
396-
397-
You can download the complete sample from this [link](https://gitea.syncfusion.com/essential-studio/maui-AISolution/src/branch/development/maui/samples/SmartComponents)
394+
You can download the complete sample from this [link](https://github.com/SyncfusionExamples/Integrate-openai-powered-smart-paste-into-DataForm-for-Seamless-Data-Entry/tree/master)
398395

399396

400397

0 commit comments

Comments
 (0)