Basic Components

Overview

The IntelliBuddies Form Designer includes a collection of basic components on the left panel, similar to those found in traditional web forms. Each component has its own configurable settings, JSON code representation, and example fields to guide setup and customization.

Following are the basic components:

Text Field

You can use a Text Field to input short and general text. Options to define input masks and validations allow users to format information as desired.

Text Area

The Text Area component offers multi-line input and allows you to input long text. The Rows setting determines the number of visible rows.

Number

The Number component allows you to input any numerical value. Use a thousand Separator to separate thousands with a comma, always show decimals, even if zero, and set the maximum number of decimal places to display.

Password

You can input passwords using the Password component, which displays asterisks instead of the actual value for security.

Checkbox

You can use a checkbox to input a boolean value. It can be either checked (true) or unchecked (false). There are options to set a shortcut and input type.

Select Boxes

This component allows users to select multiple options in checkbox format. The Data tab allows you to customize settings like value shortcuts and validation.

• Values—Values allow you to add options to the Select Box component, with the Label column representing the value visible to users and the Value column representing the stored data name.

Select

The Select component allows users to select from a list of values in a dropdown menu. It offers flexibility regarding the data source, and various settings for filtering, querying, and loading data values are available.

Radio

The Radio component lets users choose a single option from a list displayed in radio button format. Users can click the selected option again to deselect it, returning the field to its default state.

• Values—Enter the values from the list. The Label column is displayed to users, while the Value column is stored in the database.

Button

The Button component allows you to perform various actions within your form. While typically used for form submission, it can also trigger workflow events, reset fields, authenticate users via OAuth, and more. The component also provides several options to customize its style and theme.

• Action - Select the action you want the button to perform:

  Action	Description
  Submit	Submit the form and complete the associated task.
  Custom	Executes custom logic specified in the Button Custom Logic field.
  Reset	Use this option to reset the form fields.
  POST to URL	Submits the form to the URL and any headers specified in the Headers section.
  Save	Saves the form as a draft. The user has to perform a Submit action to complete the task associated with the form.
  Save & Close	Saves the form as a draft and closes it.

• Theme - From the dropdown list, you can select the color theme for the button.
• Size - Select the button size (Small, Medium, Large) from the dropdown list.
• Block Button - The stretch covers the entire width of the bounding container.
• Left / Right Icon - Add an icon by specifying the icon class string (e.g., "fa fa-plus").