Skip to main content
Version: 1.22.3

Add Widget to Form

You can add widgets to record forms to gain more functionality or for any other purpose.

To prepare a widget before adding it to a form, follow the steps below:

  1. Configure widget displayability before adding it to the layout.
  2. Configure the option schema.

After all preparations are done, you can add a widget to a form. To do so, complete the steps below:

  1. Open the form you want to add a widget to.
  2. In the burger menu , select Configure → Form → Layout.
  3. Add a widget to a form layout.
  4. Click Save to apply the changes.

Configure a widget​

First, you need to configure the specified widget to make it available for adding. To do so, follow the instructions provided in the Widget Displaying article.

Add a widget to a form layout​

On the form, select a widget you want to add:

  1. Click the required widget in the Available box.
  2. Drag it or use the buttons to move the widget to the Selected box.

3. Configure the value of the widget options. To do so, click to the right of the widget title in the Selected box. 4. Define a widget position on the form with the and buttons. Use splitter elements to create the form structure. You can also drag the items between the boxes, and within a single box, instead of using the buttons.

See the Form Layout article to learn more about form layout configuration.

Configure an option schema​

To open the modal window where you can configure the widget option values, click to the right of the widget title in the Selected box.

See Page Structure to learn more about widget configuration when adding a widget to a page or to a form.

To configure the widget options schema, follow the steps below:

  1. Enter the widget options in JSON format.
  2. Specify the required widget option values, otherwise, the default values will be applied:
{
    "tableName": "itsm_incident",
    "condition": "state!=10"
}

The widget of each type has common Attributes along with the set of private attributes. See the Portal SimpleTags article to learn more.

  1. Click Save to apply the changes.