2.2.10.15 Grid Table

Properties of Grid Table

1. ID – unique identifier of the table
2. Visible Row Count – number of rows visible
3. Fixed column count – number of columns to fixed
4. Model – model to be used
5. Entity set – entity set to be used based from the model assigned
6. Filters – set the filters to be passed onto the model
7. OnFilter – executes the javascript assigned to the event
8. Selection mode – type of selection
9. Selection behaviour – method of selection
10. Visible – shows/hides the table
11. OnRowSelect – executes the javascript assigned to the event
12. OnSort – executes the javascript assigned to the event
13. More - opens up the Additional Properties Dialog Screen

14. Advanced - properties of the control not available in the above list can be added here. 

    Setting Additional Properties provides further information about the Advanced property

More Properties Screen

1. No Auto Load – setting to prevent loading the  data into the table
2. OnUpdateFinished - executes the javascript function assigned for this event
3. rowHeight – controls the height
4. Width – controls the width
5. columnHeaderHeight - controls the header height
6. columnHeaderVisible – shows/hides the column header
7. firstVisibleRow – first visible row
8. Editable - enables/disables the table
9. Threshold - defines the number of entries to be requested from the model for each grow (e.g. setting it to 100 will request and show the first 100 entries)
10. showColumnVisibilityMenu
11. showNoData – shows the table when empty
12. visibleRowCountMode, minAutoRowCount, fixedRowCount, rowActionCount and fixedBottomRowCount – Row count properties
13. enableColumnFreeze, enableCellFilter, enableSelectAll, enableCustomFilter, enableBusyIndicator, enableColumnReordering and enableGrouping – enable additional table properties and funtionalities

Step-by-step guide

1. Right click on a Page and select Add Table-→Grid Table
   
2. A Grid Table has been added.
   
3. Right Click on the Grid Table and select Add Table Columns
   
4. Right Click on the created Table Column and select Add Column. The Column Heading can be set in the created column.
   
5. Right Click on the Column and select Add Cell.
   
6. Right Click on the Table Cells to add the corresponding UI Element
   

Related articles

• Page:
  2.11.5 Setting Additional Properties of a Control
• Page:
  2.2.5 Add UI elements to the App
• Page:
  2.2.5.1 Add UI elements outside of a Form Element