---
description: A wizard for configuring forms' dataproviders
---

# Form Dataproviders Configurator

## Overview

The **Form Dataprovider Configurator** is part of the form creation process where you can add data providers with advanced configurations. It can also be accessed by clicking ![](https://3933488479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjpWd52BKwABWxF2lScUK%2Fuploads%2Fgit-blob-28ea362e5b77ac916f2d6b04ea9b337e2bdd626b%2Fform-dataproviders-config.jpg?alt=media) icon in the form's editor toolbar.\
It provides detailed options to link form fields to data sources and customize each field's component type.

<figure><img src="https://3933488479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjpWd52BKwABWxF2lScUK%2Fuploads%2Fgit-blob-d4c368bd3408223bb8e0fcb7ea0ca291ca37e2a2%2Fnew-form-wizard-2-simple-config.jpg?alt=media" alt=""><figcaption><p>Form Dataproviders Configurator</p></figcaption></figure>

## Sections

### Left Panel

#### << Advanced configuration

Button to switch between simple and [advanced configurations](#advanced-configuration-section).

#### Filter Box

Type filter text: Input box to filter the data providers by name.

#### Data Providers List

Data Providers List: Displays the available data providers from the selected data source. You can expand categories to view more options. Categories include table columns, calculations, scope and form variables (if any), aggregates, relations.

#### Use Single Click

Checkbox to enable single-click selection of data providers. This option is not selected by default, data provider selection being done by double-clicking on it.

### Right Panel

#### Selected Data Providers

Shows the name and component/template for the selected data providers. Each selected data provider appears here, allowing you to assign a specific component or template to it.

#### Component/Template Selection

Dropdown menu in the "Component/Template" column to select the component type for each data provider. It includes all available options.

#### Delete Icon

Icon next to each selected data provider to remove it from the list.

### Buttons

You can select one of the options:

* **Back**: Go back to the previous step.
* **Next**: Proceed to the next step (if available).
* **Finish**: Complete the form creation process.
* **Cancel**: Cancel the form creation process.

## Advanced Configuration Section

<figure><img src="https://3933488479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FjpWd52BKwABWxF2lScUK%2Fuploads%2Fgit-blob-97d2b725c489e0e4a48916e7fbde1d864d9751f2%2Fnew-form-wizard-2-adv-config.jpg?alt=media" alt=""><figcaption><p>Advanced Configuration Section</p></figcaption></figure>

### Component Selection for Data Types

#### String

Dropdown menu to select the component type for string data types (e.g., TextBox). This determines how string data will be displayed or input in the form.

#### Integer

Dropdown menu to select the component type for integer data types. It could be a TextBox, Spinner, or other suitable component for numerical input.

#### Number

Dropdown menu to select the component type for number data types, similar to integer but can include decimals.

#### Date

Dropdown menu to select the component type for date data types. Options might include a calendar picker or a date input field.

#### Media

Dropdown menu to select the component type for media data types, such as images or file uploads.

### Field Properties

#### Field Spacing

Input field to define the spacing between fields. This determines the amount of space (in pixels or another unit) between adjacent form fields, allowing for better visual organization and readability.

#### Default Size (w,h)

Input fields to set the default width and height for fields. This sets the initial dimensions of the form fields, which can help standardize the layout.

#### Place with Labels

Checkbox to include labels with the fields. Labels help users understand what data is expected in each field.

#### Label Component

Dropdown menu to select the component type for labels. This can be a simple text label or other components that act as labels.

#### Label Spacing

Input field to define the spacing for labels. This sets the distance between the label and its associated form field.

#### Label Size (w,h)

Input fields to set the size for labels. This controls the width and height of the label elements.

#### Place Label on Top

Checkbox to place the label above the field rather than beside it. This can be useful for mobile-friendly designs or to fit more fields in a horizontal space.

#### Fill Name Property

Checkbox to automatically fill the name property for fields. This ensures that each form field has a name attribute, which can be important for form submissions and accessibility.

#### Fill Text Property

Checkbox to automatically fill the text property for fields. This might set a default text value or placeholder for the fields.

#### Place Horizontally

Checkbox to arrange fields horizontally rather than vertically. This can be used to create a more compact form layout.

#### Automatic i18n Text Property

Checkbox to enable internationalization for text properties. This ensures that the text values can be easily translated for multilingual support.

#### I18N Prefix

Input field to set the prefix for internationalization. This prefix can be used to group related internationalized strings, making it easier to manage translations.

## Dataproviders configuration

Here are the steps for dataproviders configuration (the first two steps belong to advanced configuration):

1. Select Components for Data Types:
   * Use the dropdown menus on the left to choose the appropriate component (e.g., TextBox, Calendar) for each data type (String, Integer, Number, Date, Media).
2. Configure Field Properties:
   * Optionally, set field spacing, default size, label properties, and other configurations:
     * Enter the desired spacing between fields.
     * Set the default width and height for fields.
     * Check the "Place with Labels" box if you want labels with the fields and configure label properties.
     * Configure other optional properties like Fill Name Property, Fill Text Property, Place Horizontally, etc.
3. Add Data Providers:
   * Use the filter text box above the data providers list to search for specific data providers.
   * Expand the categories in the data providers list to find and select the data providers you want to add to the form.
   * Click on a data provider to add it to the form. It will appear in the "Selected Data Providers" list on the right.
4. Choose Components/Templates:
   * For each selected data provider, use the dropdown menu in the "Component/Template" column to choose the appropriate component or template.
5. Remove Data Providers:
   * If you need to remove a data provider from the list, click the delete icon next to the data provider in the "Selected Data Providers" list.
6. Finalize Configuration:
   * Click **Next** to continue to additional configuration steps (if any).
   * Click **Finish** to complete the form creation with the selected data providers and configurations.
   * Click **Cancel** to abort the process.
