Data Grid
Introduction
A data grid shows a list of objects in a table format. For example, a data grid can show customer’s name, grade, and all the orders a customer has placed:
Any changes made to an object are visible in all widgets. This is because changes are stored globally in the client. See Object Activities for more information.
Components
A data grid contains the following components:
- Search bar – allows end-users to search for objects in the data grid
- Control bar – allows you to control the objects displayed in the data grid by means of buttons
- Grid Columns – allows end-users to set properties for a data grid column
Properties
An example of data grid properties is represented in the image below:
Data grid properties consist of the following sections:
Common Section
The rows of the data grid can be sorted using the Sort order property. It is only available for Database data sources. For more information on sorting, see Sort Order.
Data Source Section
The data source determines which objects will be shown in a data grid. For general information on data sources, see Data Sources.
Type
The data grid supports the following types of data sources:
- Database source – objects are retrieved directly from the database. The database source can be used in offline applications.
- XPath source – objects are retrieved directly from the database
From Mendix version 10.5, the data grid widget does not have a separate XPath source, you can apply XPath constraints to the Database source.
- Microflow source – calculates the list of objects by executing a microflow
- Association source – follows an association to get to objects
The database and, below version 10.5, XPath sources retrieve objects from the database and supports searching and sorting.
Design Properties Section
General Section
Show Control Bar Buttons
This property indicates whether the control bar buttons will be visible in the end-user interface.
Default: True
Show Paging Bar
With this property, you can change the way the paging bar is shown.
| Value | Description |
|---|---|
| Yes (with total count) | The paging bar is shown, including the Go to last page button and the total count of objects. |
| Yes (without total count) | The paging bar is shown (except for the Go to last page button). Also, the total count of objects is not shown, as page numbers are shown instead. |
| No | The paging buttons are not shown. |
Default: Yes (with total count)
Number of Rows
With this property you can change the number of rows that will be shown in one page. See also the property ‘Show empty rows’.
Default: 20
Show Empty Rows
If you choose to show empty rows there will always be the grid will always show the same number of rows (see ‘Number of rows’) even if there are less objects to show on the page.
Default: False
Selection Mode
The selection mode determines whether and how the user can select items in the grid.
| Value | Description |
|---|---|
| No selection | The user cannot select items. |
| Single selection (default) | The user can select a single item by clicking on it. Clicking another item will make that item the selection. |
| Single selection and maintain | The user can select one item at a time by clicking on it. Users cannot deselect an item. By default the first item will be selected and removing a selected item will autoselect a subsequent item. |
| Multi-selection | The user can select multiple items by clicking the first one and holding the ‘Ctrl’ key while clicking on other items. Simply clicking an item will deselect all items and make the clicked item the selection. |
| Simple multi-selection | The user can select multiple items by simply clicking on them. |
Select First
This property indicates whether the first item will be selected initially. This is especially useful if there is a data view listening to this grid.
Default: False
Default Button Trigger
The default button can be triggered by a single or a double-click on a row.
| Value | Description |
|---|---|
| Single click | A single click triggers the default button. This cannot be used in combination with allowing the user to select rows. |
| Double click (default) | A double-click triggers the default button. |
Refresh Time (in Seconds)
If the refresh time is non-zero, the data grid will refresh its contents every given number of seconds. For example, a task list could be refreshed every minute so that you know when new tasks arrive. By default the refresh time is zero and this means that the grid will not automatically refresh itself.
Default: 0
Tooltip Page
A tooltip page is a page that appears when you hover your mouse over a row. The tooltip page should consist of a data view on the same entity as the data grid. Besides creating and connecting a tooltip page you also have to specify on which columns the tooltip will appear. See the property ‘Show tooltip’ of data grid columns.
Visibility Section
Visibility determines whether a widget is displayed to the end-user as part of the page.
For more information on properties of this section, see the Visibility Section section in Properties Common in the Page Editor.
Performing Specific Actions
To perform actions on a data grid, select it on a page and right-click it. The list of possible actions opens. While some actions from this list, such as Select data source, Edit condition for visible, are a quick way to set the properties, the following actions are specific actions that you can perform:
- Go to entity – opens a domain model and highlights an entity that is used as the data source
- Go to data source microflow – this action is only displayed when a microflow is set as the data source and opens this microflow
- Go to tooltip page – opens a page select as the tooltip page in properties