Introduction

The AI Form Fill Element plugin is a tool designed to automatically generate and populate data for form elements.

Plugin Information

The AI Form Fill Element plugin uses OpenAI's GPT models to automatically generate and populate data for form elements.

Plugins Available in the Bundle:

...

This plugin bundle is compatible with Joget DX 8.

Expected Outcome

The AI Form Fill Element is able to generate and populate data for form elements.

...

Figure 1: AI Form Fill Element in a form

Get Started

Prerequisites

1. Sign Up for OpenAI API:

   • Go to the OpenAI platform and sign up for an account if you don’t already have one.
   • After signing up, log in to the OpenAI platform.
     
     

2. Obtain API Key:

   • Navigate to the API keys page on the OpenAI platform.
   • Generate an API key.
   • Copy the API key; you will need it for the AI Form Fill Element plugin configuration.
     
     

3. Choose a Model:

   • Go to the OpenAI Models Documentation to understand the available models.
   • Select a model that you would like to use (e.g., gpt-3.5-turbo and gpt-4-turbo).
   • Note the model name for later use in the configuration.

Steps

1. You can obtain the jar file by the latest release at https://github.com/jogetoss/ai-form-fill-element/releases/tag/8.0.0.

...

3. You can choose to import the demo app or create the app from scratch.

Steps for importing demo app

1. Download the demo app from from Sample App(.jwa file).

2. Go to Joget Home or All Apps and click on Import App to import the downloaded demo app.

Steps for creating app from scratch

1. Create a form with the desired fields (e.g., Name, Email, Contact, Status, Address, Gender, Date of Birth). And then Then add the AI Form Fill Element in to the form.

Figure 2: Add AI Form Fill Element in the form

2. Then click  Click on the Form Auto Fill AI element and enter the necessary configurations. :

Enter the model name you chose.

, Enter the API key you obtained from OpenAI , (you can add the API Key key to App variables and then use a hash variable to reference the values. For ; for more information, please refer to to App Variable).

Enter the Proxy Domain (e.g., https://api.openai.com).

Specify the number of rows you want the AI to fill in the form grid when the Form Fill AI element is executed.

Figure 3: Configure the AI Form Fill Element

AI Form Fill Element Plugin Demo

Once all configurations have been completed, the user can click on the icon on the right to auto-fill the form with dummy data using GPT.

Image Added

Figure 4: Click on the icon to automatically fill the form using GPT

The form grid is filled with data according to the number of rows specified during the configuration.

Image Added

Figure 5: Form grid filled with the specified number of rows

AI Form Fill Element Plugin Properties

Below are configurations for section "AI Form Fill Configuration"

Related Links

• Refer to the OpenAI platform to sign up.
• Refer to the OpenAI Models Documentation for information on available OpenAI models.
• Refer to the API Keys page for generating and managing your API keys.
• Refer to App Variable to learn more about App Variable

Sample App

APP_Kb_dx_AIFormFill.jwa