Skip to main content

Data Grid

Data grid shows a list of entity records. Also lets users sort, filter, and invoke commands or batch commands on the entity records.

Add a Data grid to a page view. Click on the element to open it's configuration:

General​

Data​

  • Entity – first, pick an entity to list it's records
  • Data source – by default lists all records of selected entity. This field allows to narrow the results with queries similar to this: (entity, db, ctx) => db.EntitySet.Where(e => e.Owner == ctx.User)

General​

  • Label – Title of the Data grid
  • Visible expression – security condition for showing the Data grid
  • Display mode – option to switch to compact mode that has less UI elements around the grid. Normal mode lets application users export Data grid content as .XLS file
  • Rows per grid page – rule for pagination of the Data grid

Columns​

Create or edit Data grid columns in this section. Magic wand "wizard" helps you create columns for entity attributes and references.

Adding a new column​

  • Label – label of a Data grid column
  • Type – data type of a column content
  • Text expression – expression representing a text value shown in a column
  • Custom sort expression – expression used for sorting the column values
  • Text alignment – alignment of text within a column

Special column types​

  • Entity detail column – content of a column links to an entity detail page
    • Entity – type of an referenced entity
    • Entity expression – expression representing the entity value
    • Display expression – expression representing the text displayed in a column
    • Detail page – detail page used to display the entity
    • Detail format – select Modal or normal format of the detail page
  • Document download column – lets application users download documents
    • Document expression – expression representing the document value
    • Document display text expression – expression representing the text displayed in a column

Image preview column​

It is also possible to create a column with images. The best practice is to first create previews of the images we want to display in this column so that they are not too large. The expression should then look something like this:

(entity, db, ctx) => entity.Preview != null ? $"![Image preview]({App.Urls.Documents.Generate(entity.Preview)})" : ""

Or like this if you want the preview to be a link to the original image:

(entity, db, ctx) => entity.Preview != null ? $"[![Image preview]({App.Urls.Documents.Generate(entity.Image)})]({App.Urls.Documents.Generate(entity.Image)}){{target=\"_blank\"}}" : ""

Highlights​

Lets you create conditional highlights for Data grid rows. Merging highlights is possible and highlights lower in the list are evaluated later. For example conditions for two highlights are returned true for a specific row. Both highlights set shading color and only the first highlight sets an icon. The row will get icon from the first highlight and shading from the second highlight.

  • Name – name of the highlight. Shows in a list of highlights and in a Legend of a Data grid
  • Icon – icon that will show next to a Data grid row
  • Color shading – background and text colors of a Data grid row
  • Use bold text – "false" will not override "true" when merging highlights
  • Use italic text – "false" will not override "true" when merging highlights
  • Highlight condition – expression that needs to return true for the highlight to be used

Filters​

Lets you create filters for application users to further narrow down the content of a Data grid. Magic wand "wizard" helps you create filters for attributes and references of the entity.

  • Name – name of the filter, shows in a filter layout
  • Data type – data type of filtered value
  • Constraint – type of constraint used when comparing filter value with data source.Constraints are mostly self explanatory, except for date range filters:
  • Inside range – returns true when entity value is inside range of the filter value
  • Contains range – returns true when filter value is inside range of the entity value
    MyEntity.MyDate.HasValue ? DateRange.OfDay(MyEntity.MyDate) : DateRange.OfDay(DateTime.MinValue)
  • Filtered expression – expression representing the value on which the filter is applied

Do not forget to add created filters to a layout.

Filters layout​

Created filters need to be added to layout to be accessible to application users. Select a Layout type and then add desired filters from the Data fields menu. Clicking a data field in layout opens it's preferences where you can set up default values, just like when editing any other view.
Having default values in the filters mean that whenever app user opens the page, filter expand is opened and data is filtered.

Commands​

Adding at least one command to a Data grid creates an Actions column. All commands have buttons in this column. Magic wand "wizard" helps create common commands (like system command "Delete entity") or Business commands of an Entity command type of the same entity as Data grid.

  • Type of command – Business or System command
  • Command – select a command to be executed
  • Label – text label of a command button
  • Icon – icon of a command button
  • Enabled condition – security condition determining if the command is enabled for an entity
  • Visible condition – security condition determining if the command is visible for an entity

Batch commands​

Adding at least one Batch command to a Data grid creates a Batch commands expand above and checkbox column on the left side of the Data grid. Creating a Batch command is the same as creating a Command, but it allows for invoking Entity batch commands.

The difference is that normal Entity command is invoked individually on all selected entities, while Batch command is invoked only once but receives a collection of entity records in it's model.