Using grid questions in forms

Use the grid question (also known as Line Item question) when you need to create a table, or list, for users to enter a series of text or numbers. Grid questions are ideal for collecting structured data such as expense items, product lists, or any scenario requiring multiple related data points per entry.

Prerequisites

Before creating grid questions, ensure you have:

• Form editor access — Permission to create and modify forms in your workflow system
• Basic form knowledge — Familiarity with creating basic form questions and containers
• Data planning — A clear understanding of what data you need to collect and how it should be structured

Creating a grid question

To create a grid question, drag the Grid icon from the question palette and drop it into a container. You can immediately add a label for the grid, or you can click the Edit icon and add a label when you begin configuring the grid.

Configuring the grid

When you hover over the grid, clicking the Edit icon will open the Grid Configuration window.

The Grid Configuration window displays multiple tabs for different configuration options. The system selects the Basics tab by default.

On the Basics tab, you can configure:

• The grid label (the system shows this above the grid on the layout)
• The Client ID
• A CSS Class
• The grid width (by default the grid will fill 100% of the container it’s in)
• Whether the grid is Disabled/Enabled
• Whether the grid is Read-Only
• Whether the grid is Hidden or Shown by default
• Whether the Label will show above the grid

In the Define Columns tab, you configure the columns you want in the grid.

Click Add Column to open the column configuration dialog where you can set up each column’s properties.

In the Add Column window, you can configure:

• The Column ID — this acts similar to the ClientID of a question as if you are referencing it in JavaScript.
• The Column Label (column header)
• Any CSS style classes
• The column width (the system distributes columns evenly by default, indicated by an asterisk)
• The Data type (text, static text, number, date, boolean, file attachment, select list, currency, row aggregation).

  Static Text enables you to add persistent text that can’t be edited in the column. Row aggregation enables you to calculate values (Sum, Average, Column Count, Min, Max, or Multiply) across columns in the row.

• Aggregation Type (the system uses this for calculating values including Sum, Average, Row Count, Min, Max). This displays in the footer of the grid.

  You need to enable Show Footer in the Define Rows tab to make the calculation visible.

• Editable — Check if you want the user to be able to edit the data directly in the grid.

  Even if this isn’t checked, users can still enter the value into the Add Row dialog.

• Required/Not Required (if you require a column, all pre-rendered rows in the grid must be completed, including unused rows)

In the Define Rows tab, you can indicate how many rows your grid should have initially. In the Rows Specified field you indicate how many rows should be shown initially. Configuration here is optional and you only use it if you want to pre-define a number of rows in the grid.

• How many rows your grid should have initially. In the Rows Specified field you indicate how many rows should be in the grid.
• In the Grid Height field you indicate how many rows you want the grid to show at one time. If you indicate a height that’s taller than the number of rows specified, the system will show blank space at the bottom of the grid. Alternatively, if you indicate a height that’s shorter than the number of rows in the grid, the system automatically adds a scroll bar so users can scroll down to the hidden rows.
• For columns that are defined as Static Text, you can click on the individual cells and add the desired text from this view.

  Make sure to click the Render button to generate the grid before saving.

• Check the Show Add Row button if you’d like users to be able to add additional rows to the grid. This will add a button for users to insert additional rows in the grid.

The system then provides users with a dialog box that lets them add data in a new row. The system presents the information vertically but keeps the column headings the same.

• Check the Show Footer button if you are using the Aggregation Type in any of your columns. This will add a space at the bottom of the grid to show the calculation.
• Check Allow users to delete rows to display the Delete button that enables users to delete rows from the grid.

Example use cases

Expense reporting — Create columns for Date, Description, Category, and Amount with currency data type. Enable aggregation to automatically calculate total expenses.

Product ordering — Set up columns for Item Name, Quantity (number), Unit Price (currency), and Total (calculated using row aggregation multiply function).

Employee evaluation — Use columns for Criteria (static text), Rating (select list), and Comments (text) to create structured feedback forms.

Troubleshooting

Grid not displaying correctly — Ensure you clicked the Render button after making configuration changes.

Required columns causing validation errors — Remember that if you mark a column as required, all pre-rendered rows must be completed, including empty rows.

Scroll bar appearing unexpectedly — Check your Grid Height setting in the Define Rows tab. If the height is shorter than the number of rows, a scroll bar will appear.

Aggregation totals not showing — Verify that Show Footer is enabled in the Define Rows tab and that you’ve set an Aggregation Type for the relevant columns.

Users can’t add new rows — Confirm that Show Add Row is enabled in the Define Rows tab configuration.

For additional form building guidance, refer to the creating forms and form questions guides.