Skip to main content
Matrix42 Self-Service Help Center

Grid Controls

Managing data representation in grids: configuring display, navigation, and editing information organized in the form of spreadsheets.

Details

This page provides an overview of the Layout Designer's Grid Controls, their types, configurable properties, and use cases. 

Grid Controls are one of the data representation types intended for proper display, navigation, and editing information organized in the form of spreadsheets. Grid Controls display spreadsheet data in the user interface not as a stand-alone page entirely filled out with the listings but as a grid within a page. Grid controls are a constituent part of a layout template placed along with the other data elements also referred to as Control Descriptors.

Appropriate Grid Controls are automatically prompted for usage in the  Layout Designer during the layout template configuration process. Suggested grid types are based and depend on the selected for the display Data Model item.

 Path:  all available in the application Grid Controls can be found in Administration application → User InterfaceLayouts → Customize layout → Layout Designer → Toolbox → Grid Controls:

grid_controls_layout_designer.png

Prerequisites

Grid Controls can be  automatically suggested in the Layout Designer after the following sequence of user actions:

  1. User Interface → Layouts menu: create and fill out basic required settings or click the "Customize"  button to edit one of the following Layout types:
    • Dialog  (most commonly used with Grid Controls layout type);
    • Preview;
    • Wizard;
    • Landing Page. 
  2. Data Model: drag&drop necessary for display data item on the layout template canvas: drag_n_drop_data_model_example.png
  3. Control Descriptor: select data representation type among the automatically suggested options:drag_n_drop_grid_control_example.png

In a case when the suggested data representation option is :

  • Grid
  • Multi Fragment Grid
  • Objects Grid
  • Object Relations  Grid
  • Dynamic Grid

then you are dealing with Grid Controls.

 

 

Grid Controls vs. Dataset Views

At the very first glance Grid Controls and Dataset Views can seem to have a lot in common as for data visual representation in grids but their usage and configuration differs.  

Characteristics Grid Controls Dataset Views
Definition

can be defined as spreadsheets or table data display according to the appropriate Data Model or data input type

imply that data listings are represented as a grid but without recurring to Grid Controls

Location on the page layout such grids are included in the page but do not take the entire space of the Layout

Dataset Views are represented to the end-user as a grid that takes the entire page of the Layout. 

 

Data representation form
  • grids: data is shown in grids only

each of the data representation forms of the Dataset View is configured separately and can be displayed to the end-users as 

  • grid
  • tiles
  • board
  • custom configuration form with expanded and hidden data display forms
Data management mode
  • preview
  • browsing and filtering  displayed data
  • sorting columns of the grid (ascending/descending order)

Extra options for data modification:

  • editing
  • adding new records 
  • deleting records
  • preview (main purpose)
  • browsing and filtering  displayed data
  • sorting columns of the grid (ascending/descending order)
Example grid_control_example.png dataset_view_grid_example.png

 

 

Grid Control types and use cases

Matrix42 Solution Builder application provides the following types of Grid Controls data representation right out of the box:

Grid

a basic grid type which presents records of the spreadsheet or a database table as rows and columns.

Displayed data has a pre-defined static structure of the columns, for instance: 

grid_example.png

is used to group and display a set of dependent objects attached to an independent one, for instance:

  • Object 1:  created incident (independent object);
  • Object 2: a list of time tracking records created due to the work completed within the scope of a specific incident.  It is a dependent object with its own particular data structure.

We recur to the Multi Fragment Grid in order to show how long did it take to complete specific actions required for the incident resolution, implying that without the relation to a specific incident the time tracking record will make no sense:

multifragment_grid.png

Thus the Multi fragment grid objects are in subordinate dependency where one object directly relies on another.  The subordinate Object has its own structure and cannot exist without another stand-alone Object.

is used to group and display data of the independent objects having established relations due to some context or circumstances, for instance:

  • Object 1: a list of created incidents ;
  • Object 2: a list of services that can be ordered by the user.

By linking these independent and previously created Objects we recur to the Object Relations Grid in order to show all services that were affected by a specific incident.

Displayed data has a pre-defined static structure or the displayed columns, for example: 

object_relations_grid.png

 At the same time, each incident is a stand-alone object of the system that can have one, multiple or even do without the relation to any of the services.

Services are also represented in the system as stand-alone objects, as they are assigned or detached from the incident, ticket or problem and will still be available in the service catalog and can be ordered multiple times by different users.

Object Grid

is used to group and display a set of related and additionally filtered objects. 

Object Grid can be considered as  a stand-alone type of grid as it:

  1. displays objects of a specified type;
  2. displayed objects are additionally filtered by specified criteria.

Object Grid is widely used in Wizards,  for examplea list of  available services that can be added to the catalog:

object_grid_eg.png

The Object Grid displays all services that are available in the system (related service as an object) but were not added to the currently edited catalog (currently excluded services as a filtering criterion).

Dynamic Grid

is used to group and display data that doesn't have a static structure  of the displayed columns, as each time their number depends on the data from the initial input source and therefore may vary,  for instance: 

  • the data source has a pre-defined structure of the input data and holds a specific number of columns that can be shown;
  • a page with a dynamic grid displaying does not have any pre-defined  fixed column structure;
  • each time the data source has to be previewed on the page, the dynamic grid flexibly adjusts to the number of columns to be shown according to the data initially provided in the data source.

For instance, there is a data source which should be imported into the application. The data source is provided in a certain format with a specific structure of the data (text file, .csv,  .xml,  .xlsx, MSSQL data etc.) but each time the data and its structure differ. Uploaded file preview renders the data in the dynamic grid  according to the provided data source as follows:

dynamic_grid.png

 

Generic property Groups

There are the following groups of configurable properties suggested based on the grid type:

Model contains a set of rules defining data retrieval and filtering sources for the edited element of the page layout template.
Common specifies such basic properties as data access and editing mode, the title of the grid,  required fields of the grid.
Paging defines the records' pagination settings such as the total number of rows displayed per page, pagination navigation mode.
Appearance 

defines end-user interaction rules with the standard components of the currently edited template element, such as:

  • allowing or removing grid header row displaying with all the search filters;
  • disabling grid items browsing;
  • managing ranking or position of the entries in the grid;
  • managing entries creation or deletion options.
Device visibility

defines the rules of the edited element displaying based on the end user's device type and screen resolution:

  • desktop;
  • tablet;
  • mobile.

Grid Controls properties list

 Property 

group

Grid type →

Properties ↓

Grid Multi Fragment Grid Objects Grid Object Relations Grid Dynamic Grid
Model            
  Data ✔️ ✔️ ✔️
  Selected items ✔️ ✔️ ✔️
  (Entity) Class name ✔️ ✔️
  Relation ✔️
  Allowed types ✔️ ✔️
  Filter ✔️ ✔️
  Browse where clause ✔️
  Column definition ✔️ ✔️ ✔️
  Object ID(s) ✔️ ✔️
  Columns ✔️ ✔️
  Current item ✔️ ✔️ ✔️ ✔️
Common            
  Help ✔️ ✔️ ✔️ ✔️ ✔️
  Label ✔️ ✔️ ✔️ ✔️ ✔️
  Show Label ✔️ ✔️ ✔️ ✔️ ✔️
  Inline mode ✔️
  Disabled ✔️ ✔️
  Read-only ✔️ ✔️
  Edit mode ✔️ ✔️
  Is new object ✔️
  Required ✔️
  Enable filter of configuration item ✔️
  Multi Selection ✔️
  Name ✔️ ✔️ ✔️ ✔️ ✔️
Paging   ✔️
  Allow paging ✔️
  Page size ✔️
  Page number ✔️
  Total items count ✔️
Appearance            
  Enable row selection ✔️ ✔️
  Full height ✔️ ✔️ ✔️ ✔️ ✔️
  Minimal height, px ✔️ ✔️ ✔️ ✔️ ✔️
  Enable Drag'n'Drop ✔️
  Delete actions ✔️ ✔️
  Hide export button ✔️
  Visibility ✔️ ✔️ ✔️ ✔️ ✔️
  Hide Grid Header ✔️ ✔️ ✔️ ✔️ ✔️
  Margin ✔️ ✔️ ✔️ ✔️ ✔️
  Padding ✔️ ✔️ ✔️ ✔️ ✔️
  Flex option ✔️ ✔️ ✔️ ✔️ ✔️
  Disable add ✔️ ✔️ ✔️
  Disable create ✔️ ✔️
  Disable Delete ✔️
  Disable remove ✔️ ✔️
  Disable edit ✔️
  Show add button ✔️
  Show remove button ✔️
Device visibility          
  Desktop ✔️ ✔️ ✔️ ✔️ ✔️
  Tablet ✔️ ✔️ ✔️ ✔️ ✔️
  Mobile ✔️ ✔️ ✔️ ✔️ ✔️

 

  • Was this article helpful?