Form Builder

Last updated: October 14, 2026Applies to current supported NIM releases

Apps · Form Builder

Arrange a form, configure its buttons, and build the modals that people use to complete their work.

The form builder is a panel in the app designer that shows the form you are working on as a list of its items. Use it to add items, put them in columns, change their properties, decide what a button does, and create modals. The form behind the panel updates as you make each change, so you see the result right away.

The form builder works together with the table builder: from a grid in the form builder you open the table builder to pick and configure its columns, and from a button column in the table builder you open the form builder to build the modal the button opens.

note

The form builder only makes changes in Design mode. In Run mode the panel stays open, but you cannot change anything in it. Changes are kept in the app as soon as you make them; select Save in the app designer to store the app.

Arrange a form

Add items, organize columns, and edit field properties.

Build the layout →

Configure interactions

Choose button behavior and create modals for grid rows.

Set up buttons and modals →

Open the form builder

Open an app in the app designer and select Design. You can then open the form builder in these ways:

From	How
Forms drop-down in the top bar	Select the wrench icon next to a form name. The designer shows that form and the form builder opens on it.
Forms tab	Select the wrench icon (Open the form in the form builder) in the row of a form.
Floating form window	When the form is shown in the floating window (the Show the form in a floating, resizable window button next to Preview), select the wrench icon in the window's title bar. Select it again to close the form builder.
A button in the form	In Design mode, click a button in the form. The form builder opens with that button selected and its On click row unfolded, so you see what the button does.
The table builder	In the settings of a Button column, select Opens modal… or Edit modal, or select the link under Does. See Open the table builder from the form builder, and back.

When you open the form builder on its own, it follows the form the designer shows: if you go to another form, the form builder switches to that form.

The list of items

The list shows the items of the form in the order of the form. Each row is one item, a row of loose units that do not belong to an item, or a row of Columns. Unfold a row to see its properties and other settings.

The list has these columns:

• Item / property: the name of the item or property.
• Value: for a property, its value. For an item, a short summary: its label, the grid column it shows, the table of its grid with how many parameters are bound, and what its button does (on click: …) or how many clicks it has.
• The last column holds the buttons for the row, such as remove, add, and edit.

Selecting a row in the list selects the item in the form and scrolls it into view. Selecting an item in the form selects its row in the list.

Arrange items

• Change the order: drag an item by its handle onto another item. Dragged down, it lands below that item; dragged up, it lands above it.
• Move into a column: drag an item onto a column row to put it at the bottom of that column, or onto an item in another column to put it above that item.
• Replace an item: select the item name in the Item / property column and pick another item. The new item takes the place of the old one, and for a modal opened from a grid it keeps showing the same grid column.
• Remove an item: select the remove button of the row (Remove from the form).

An item whose rows are not together in the form cannot be moved or replaced as one. Its tooltip says so.

Work with columns

A Columns row holds columns side by side, each with its own items one below the other.

• To change the widths of all columns, select the Value of the Columns row and pick another layout.
• Unfold the Columns row to see Column 1, Column 2, and so on. To change the width of one column, edit its Value (out of 12). The columns next to it make room or take what is left.
• Select a column row to add an item to it with Add, or drag an item onto it.
• To remove one column, select the remove button of its row. The items in it move to the column next to it.
• To remove the whole row of columns, select the remove button of the Columns row (Take the columns apart). The items stay in the form, one below the other.
• A Columns row has one property: hide row, which hides the whole row of columns when its condition is met.

You cannot put a row of columns inside a column.

Edit properties

Unfold an item to see its properties. These are the same properties that the Props tab shows for the item, sorted by category and name. Edit a property in the Value column, the same way as on the Props tab.

For a grid, the unfolded item also shows:

• Table: the table the grid shows. Pick a table from the list. The grid gets the columns and parameters of that table.
• parameter <name>: one row for each parameter of the table. For a parameter that takes a variable, pick the app variable that supplies its value. A parameter with a fixed value is shown, but you change it on the Table tab. The tooltip tells you when the builder proposed the variable, and why.

To pick which columns of the grid are shown and how, select the item and then Table builder.

Set up what a button does

Every button of an item, and every click on a grid column that has a click action or a click event, has its own On click row under the item. If an item has several buttons, each row is named On click: <button text>. For a grid column, the row is named On click: <column>, followed by the event name when the column raises a named click event.

The Value of the On click row describes what the click does, for example Close the modal, or nothing yet. Under it, each action of the click has its own row, in the order the actions run.

Pick a common behavior

Select the Value of the On click row and pick what the button should do. The builder adds the matching actions for you:

Choice	Available on	What the button does
Close the modal	A modal	Goes back to the form that opened the modal. What was filled in stays in the variables.
Cancel: clear the fields and close	A modal with fields	Resets the variables of the fields of the modal, then goes back to the form that opened it.
Reset the form	A normal form	Sets every field back to its initial value.
Go to form <name>	Any form	Shows that form in the place of this one. One choice for each normal form of the app.
Open modal <name>	Any form	Opens that modal over this form. One choice for each modal of the app. The form builder then knows this button as the opener of the modal.
Open a new modal...	Any form	Creates a new modal that this button opens, and opens it in the form builder. See Create a modal.
Run a script function...	Any form	Adds a script function action and opens its editor, so you can pick the function and its arguments.
Complete the workflow step	Any form	Completes the workflow step that the app was opened for, without an outcome. Then a modal closes, or a normal form is reset.
Complete the workflow step: approve	Any form	Completes the step with the outcome true. Then a modal closes, or a normal form is reset.
Complete the workflow step: reject	Any form	Completes the step with the outcome false. Then a modal closes, or a normal form is reset.
Remove all actions	Any form	Removes every action of the click. The button does nothing.

A choice does not add an action that the click already has. Actions that go to another form are always placed last, so that the button first does its other work.

Edit the actions one by one

• Add an action: select the add button of the On click row. A new action is added at the end, and the action editor opens so you can choose what it does. This is the same editor as on the Actions tab.
• Edit an action: select the edit button of the action row.
• Remove an action: select the remove button of the action row.
• Change the order: drag an action onto another action of the same click.
• Wait for service actions: shown when the click has service actions. Select it to let the actions after a service action wait until the service action is complete. This is the same setting as on the Actions tab.

Changes you make here are also shown on the Actions tab, and the other way around.

Create a modal

A modal is a child form that opens over the form that opens it.

1. Unfold the button that should open the modal.
2. In the Value of its On click row, select Open a new modal....

The builder creates a new modal (named modal, or modal2, modal3, and so on when that name is taken), lets the button open it, and shows the modal in the form builder. The title bar links back to the form with the button.

You can also create a modal for a button column of a grid from the table builder. See Open the table builder from the form builder, and back.

In a modal, the item list offers the items that are made for modals, and Modal size sets the size of this modal.

Build a modal that shows a grid row

When a modal is opened by a click on a grid column, the form builder knows that grid. It uses the grid to help you build the modal:

• Shows column: each field of the modal has a Shows column row. Pick the column of the opening grid that the field shows. The field gets the column name as its label, and the variable of that column. If the column does not write a variable yet, the builder gives it one and makes the rows of the grid selectable, so that a click on a row fills the variable.
• New fields: when you add a field, the builder proposes the first column of the opening grid that no other field shows yet.
• A field per column: adds a text field for every column of the opening grid that no field shows yet.
• Grids in the modal: when you pick a Table for a grid in the modal, the builder binds its parameters to the variables of the opening row where it can: to a column with the same name as the parameter, or to the only variable of the same data type. The tooltip of the parameter row says how the variable was found.

Open the table builder from the form builder, and back

The two builders hand over to each other, so that you can build a grid and its modal in one flow:

• Form builder → table builder: select an item with a grid and select Table builder. The table builder opens on that grid, with the columns that describe the data first, so you can choose which columns to show.
• Table builder → form builder (modal): in the settings of a Button column, select Opens modal… to create a modal that the button opens, or pick an existing modal and select Edit modal. The form builder opens on the modal, in the place of the table builder.
• Table builder → form builder (actions): in the settings of a Button column, select the link under Does to edit what the click does. The form builder opens on the form with the grid, with the On click row of that column selected.
• Back to the table builder: select the link in the title bar of the form builder.

When a builder takes the place of the other one, it keeps the same position and size, so the switch looks like one panel that changes its contents. Hold Ctrl (Cmd on a Mac) while you select one of these buttons to open the other builder next to the current one instead.

The panel

Title bar

Show panel controls and behavior

The title bar shows Form builder – followed by the name of the form, and whether it is a form or a modal (child form).

For a modal, the title bar also shows where the modal is opened from: a link with the name of the form that opens it, followed by the button or grid column that opens it. Select the link to go back to that form:

• If the modal is opened by a button, the designer shows the form of that button and selects the button.
• If the modal is opened by a grid column, the table builder opens on that grid with the column selected, in the place of the form builder. Hold Ctrl (Cmd on a Mac) while you select the link to open the table builder next to the form builder instead.

If more than one button or column opens the same modal, a drop-down list in the title bar lets you pick the one to work with. The choice decides which grid's columns the builder offers for the fields of the modal (see Build a modal that shows a grid row).

Position and size

Show panel controls and behavior

Use the buttons on the right of the title bar to place the panel:

Button	What it does
Dock at the bottom	Docks the panel at the bottom of the window; the form moves up to make room. Ctrl+click docks it at the top.
Dock at the right	Docks the panel at the right of the window; the form moves left. Ctrl+click docks it at the left.
Float over the form	The panel floats over the form. Drag the title bar to move it.
Full height	While floating, the panel takes the full height of the window. You can also double-click the title bar. Select it again to return to the previous height.
Fill the whole window	The panel fills the window. Select it again to return to the size and place it had.
Close	Closes the form builder.

When the panel is docked, drag its inner edge to resize it. Only one builder can be docked at each side of the window: if the table builder is docked on the side you choose, it starts to float.

When the form is not shown

Show panel controls and behavior

When the form builder and the table builder are both open, the form builder stays on its own form, even when the designer shows another form (for example, the form with the grid you are working on in the table builder). The form builder is then covered with the message Form <name> is not shown. Click to show it and build on. Click the panel to show the form again.

The toolbar

Show toolbar options

Option	What it does
Item list	The item to add. The list holds the items of the item libraries that fit this kind of form (a normal form or a modal). When the app has other forms, the list also has a Copy from <form> group for each of them, with the items and rows of that form. A copy keeps its labels, variables, and settings.
Add	Adds the selected item, or a copy of the selected rows. Where it goes depends on what is selected in the list below: at the bottom of the selected column, below the selected item when that item is in a column, or otherwise at the end of the form. The tooltip of the button tells you where.
Column layout	The widths of the columns to add, out of 12. The choices are 6 | 6, 4 | 8, 8 | 4, 3 | 9, 9 | 3, 5 | 7, 7 | 5, 4 | 4 | 4, 3 | 6 | 3, and 3 | 3 | 3 | 3.
Columns	Adds a row of columns side by side, with the layout you picked. If an item at the top level of the form is selected, the columns take its place and the item goes into the first column. Otherwise, the empty columns are added at the end of the form and the first column is selected, so that Add fills it.
Form size (app) / Modal size	For a normal form: the size of the forms of the app (extra small, small, medium, large, or extra large). A normal form has no size of its own, so this sets the size for every form of the app. For a modal: the size of this modal (small, medium, large, or extra large).
A field per column	Only for a modal that is opened from a grid. Adds a text field for every column of the opening grid that does not have a field yet.
Table builder	Opens the table builder on the grid of the selected item. Available when the selected item contains a grid.

On the right of the toolbar, the builder shows what it just did (for example, what a button now does) or why something did not work.

Related guides

• Table Builder — choose grid columns and add buttons that open modals.
• Workflows in Apps — connect start forms and approval buttons to workflows.

Report a problem with this page

Found an error or a missing step? Open the feedback form and describe what needs changing. The article details and Documentation topic are filled in for you.

Need help with your NIM environment? Contact Support.