Data Grid
(part of package 'Servoy NG-Grids') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent
Data Grid is a table with advanced functionality that operates on JSFoundset data (so it can work directly with the database). It is designed to work with a large number of rows, potentially infinite, since data is loaded lazily into the table, even when grouped.
This is a reference page; many components have detailed usage guides here.
Properties
arrowsUpDownMoveWhenEditing
Defines action on TEXTFIELD editor for up/down arrow keys
Type: String
checkboxSelection
When true the row has a checkbox for selecting/unselecting
Type: Boolean Default Value: false
columns
List all columns to be used in table as dataprovider
Type: Array<CustomType<aggrid-groupingtable.column>>
columnsAutoSizing
Auto sizing for columns. SIZE_COLUMNS_TO_FIT: make the currently visible columns fit the screen. AUTO_SIZE: the grid will work out the best width to fit the contents of the 'visible' cells in the column. NONE: no auto sizing action performed
Type: String Default Value: null
columnsAutoSizingOn
Apply 'columnsAutoSizing' for these events even if 'continuousColumnsAutoSizing' is false
Type: CustomType<aggrid-groupingtable.columnsAutoSizingOn>
continuousColumnsAutoSizing
Apply 'columnsAutoSizing' whenever columns width are changed
Type: Boolean Default Value: false
editNextCellOnEnter
Type: Boolean Default Value: false
enableColumnMove
If moving of columns is enabled
Type: Boolean Default Value: true
enableColumnResize
Allow the user to resize columns
Type: Boolean Default Value: true
enableSorting
Enable column sorting by clickin on the column's header
Type: Boolean Default Value: true
enabled
Type: Enabled Default Value: true
gridOptions
Map where additional grid properties of ag-grid can be set
Type: Json
groupCheckbox
When true the group has checkbox for selecting/unselecting all child rows
Type: Boolean Default Value: false
groupUseEntireRow
When true the group takes the entire row
Type: Boolean Default Value: true
iconConfig
Type: CustomType<aggrid-groupingtable.iconConfig>
localeText
Map where locales of ag-grid can be set
Type: Map
mainMenuItemsConfig
Type: CustomType<aggrid-groupingtable.mainMenuItemsConfig>
myFoundset
The foundset where data are fetched from
Type: JSFoundset Default Value: {"foundsetSelector":""}
onDragGetImageFunc
Called when row(s) drag-n-drop is started, to get the drag image as an html code.
Type: Clientfunction
onDragOverFunc
Callback when dragging over a row - returns one of the strings: 'copy', 'move', 'none' depending on the allowed drag operation.
Type: Clientfunction
readOnly
Type: Boolean Default Value: false
responsiveHeight
Table's height to be set in a responsive form. When responsiveHeight is set to 0, the table will use 100% height of the parent container. When responsiveHeight is set to -1, the table will auto-size it's height to the number of rows displayed inside the grid - in this case there is no vertical scrollbar and all rows are rendered
Type: Number Default Value: 300
rowHeight
The height in pixels of the table's rows
Type: Number Default Value: 25
rowStyleClassDataprovider
Use dataSource calculation as rowStyleClassDataprovider to set styleClass conditionally to rows. The calculation should return the class name (or names) to be applied to the row
Type: Dataprovider
showColumnsMenuTab
If the column selection panel should be shown in the column menu
Type: Boolean Default Value: false
showGroupCount
When true the number of rows for groups is shown, beside the name
Type: Boolean Default Value: false
showLoadingIndicator
Type: Boolean Default Value: true
styleClass
Type: Styleclass Default Value: "ag-theme-alpine"
tabSeq
Type: Tabseq
toolPanelConfig
Type: CustomType<aggrid-groupingtable.toolPanelConfig>
tooltipTextRefreshData
Tooltip text shown when hovering the refresh button
Type: String Default Value: "Refresh for latest data !"
visible
Type: Visible
Events
onCellClick(foundsetindex,columnindex,record,event,dataTarget)
Called when the mouse is clicked on a row/cell (foundset and column indexes are given). The foundsetindex is always -1 when there are grouped rows. If you use enabled=false on a column, make sure to test in the handler for columnindex so you only execute the code for that column IF the columnindex is for that column.
Parameters:
onCellDoubleClick(foundsetindex,columnindex,record,event,dataTarget)
Called when the mouse is clicked on a row/cell (foundset and column indexes are given). The foundsetindex is always -1 when there are grouped rows. If you use enabled=false on a column, make sure to test in the handler for columnindex so you only execute the code for that column IF the columnindex is for that column.
Parameters:
{Number} foundsetindex