Setting up a Table widget

Drag the Table widget to canvas, Setup to select source variables and adjust display. Add, edit and remove columns with + icon.

To begin configuring the Table widget, drag it from the widget library onto the canvas. Then, open the property panel to reveal the "Setup" section.

The default survey serves as the default source for the table, determining the selection of variables when adding columns and the operation of any aggregation rules if columns from multiple sources are added.

The Setup section also allows you to adjust the height of the column headers, specify the default sorting column, and manage the display of a large number of table rows.

Adding Columns to the Table

To add columns, follow these steps:

1. Click the plus + icon in the column section.

2. Choose the questions you want to add to the table by either dragging and dropping them to the right side or using the Add/Remove buttons.

3. You can select multiple questions at once by checking the boxes and using the CTRL and SHIFT keys.

To add columns to the table, click Add. You can then edit the column properties individually if needed. You can add more columns to the table anytime by clicking the plus + icon, which will reopen the dialog.

Changing Column Properties

The columns you add to the table appear in the column section. You can rearrange the columns by using the drag bar on the left or change their names by clicking on the name and editing it. To remove columns, click the trash can icon.

To expand a column and view its properties, click the arrow on the right side. In the property section, you have control over:

• The column value via the expression builder

  The value formatter to be used

• The alignment of the value column

• Whether column filtering is allowed for users

The columns section

Table Pagination

When the table exceeds the display area of the widget, scroll-bars are provided by default to allow users to view the table contents. Two properties are available to switch from scrolling to pagination, dividing the table into pages based on the number of rows in the table and the number of rows displayed per page.

Example of a paginated table

The properties are:

paginationType: pager
rowsPerPage: 10, 50, 100

Note

The default setting is infinite scroll, which applies if the "pager" type is not specified. The "rowsPerPage" property is optional. If no other values are set, the default options are 10, 50, 100, with the first number being the selected value by default, and users can choose one of the other options as needed.

Example Setup of a Table Widget

Setting up a table widget

Continued setup of a table widget

Resulting table widget with the above setup

Advanced Configuration

For details of the properties and settings, refer to widget table in the CDL Reference Guide.