Property configurator for columns
Reference documentation for the Property configurator for columns
Overview
The Property configurator for columns is used to add or edit multiple columns in a Data Grid and Table components. It is shown automatically when adding the component to a form but it can be also shown by selecting the component on the form and clicking on the gear icon in the top-right corner.
Sections
Datasource Selection
Located in the top-right corner, it allows the selection of the source from where the columns of the grid/table will be chosen, by default the is selected but it can be changed using the
Available Columns
Located below the Datasource Selection, it shows the list of , , and from the selected . It also shows Scope Variables and Form Variables.
A common use case is to have options in the grid/table to edit or delete the selected row, below the Datasource columns, there is a small section that shows a few pre-defined icons that can be used to know how to add icons as columns.
Clicking on any column or icon will add it to the list of selected columns.
Selected Columns
Occupies the right side of the dialog, it shows the list of columns that will be added to the grid/table.
For each selected column the following can be configured:
| Name | Description |
|---|---|
Dataprovider | A radio button that indicates if the column is meant to be used as a data provider, which means that the value of that specific column will be displayed in the grid/table cell |
Style Class Dataprovider | A radio button that indicates if the column is meant to be used as a style class data provider, which means that the value of that specific column will be added as a CSS class to the grid/table cell |
Style Class | A text box to enter any CSS class to be added to the grid/table cell |
Header Title | A text box to enter the header of the column |
Trash Icon | Used to remove the column from the grid/table |
Currently, there is no way to reorder the columns from the wizard, this can be done directly in the component after the columns are added by dragging and dropping them
Last updated
