Skip to main content
Matrix42 Self-Service Help Center

Objects Grid

Objects Grid settings and grid properties configuration examples.

Goal

This how-to explains the basics of the Object Grid settings and provides examples of the properties configuration.

For more information about Grid Control types and use cases see Grid Controls page.

Prerequisites

Object grid is added and configured after the following steps:

  1. Administration application: open a Solution Builder;
  2. User Interface  Layouts: create new or edit existing layout;
  3. Toolbox: search for the Objects Grid control in the toolbox and drag&drop it on the layout.
  4. Configure necessary fields for the proper data displaying in the Objects Grid.

Object grid can be used on such layouts:

  • Dialog
  • Preview
  • Wizard
  • Landing page

Minimal required property settings

The following data model properties are minimum required for the grid displaying:

  • Entity Class Name: defines the source of the data that will be displayed in the grid.

The rest of the properties are assigned by default and can be optionally modified if necessary.

Default object Grid characteristics

By default, each object grid with the configured minimum required properties results in the following page elements:

  • Heading row;
  • Column with a check-box for records multiple selection;
  • Columns data sorting order (ascending/descending);
  • Search field for displayed data filtering (global search and per each displayed field);
  • Add record from a list of existing items;
  • Pagination: all records are not shown on the same page but can be navigated through by selecting the next or previous page;
  • Refresh button for new records retrieval;
  • Export data (download .xlsx spreadsheet);
  • Column preview mode (show/hide specific columns).

objects_grid_default_preview_catalog_items.png

Object Grid: preview example with default grid characteristics

 

Properties and settings

The table provides a detailed list of configurable object grid properties, their settings, and particularities overview.

Property group Property name Description Default Property setting example

Model

Object Ids

an array of data objects that should be retrieved to the grid.

Acts as an additional filter to the data defined by the Entity class name, Allowed type and Filter.

objects_grid_object_ids.png

Selected Items

optional property of a data model that acts as a variable. Allows passing the manually selected items of the grid to a specified data model field.

Additionally requires Enable Row Selection property set to true to enable multiple items selection column displaying in the grid.

dynamic_grid_selected_items.png

Entity class name

Defines which data will be displayed in the grid. This field is required and should be selected manually:

  • ❌  not selected: by default the field is empty;
  • select data source:  start typing the entity class name and select the necessary one from the list of auto-suggestions.  Specified entity class name is a Data Definition which serves as a source of the entries that will be used in the objects grid.

Entity class name may also serve as a source of the columns retrieved to the grid's heading row. 

The system checks the following settings and displays columns based on the first available source:

a. Column definition field value; 

b. default Data query for the selected Class name;

c. Data Definition's Display expression field settings as each suggested Class name is actually a data definition with a set of configured for displaying columns (see Administration application  → Schema → Data Definition → Edit → Display expression field).

Stored in the system Data Definition is a database table with its own specific structure. This Data Definition can have a default Data query which defines a set of columns that can be displayed in the grid (applicable for cases when the Data query is based on a Data Definition). 

objects_grid_entity_class_name.png

Allowed types

  • ❌  not specified (default): data to show is retrieved based on the Entity class name field property;
  • Static value: set 1 or more filtering criteria for the retrieved data. The field auto-suggests all available in the system Configuration Items. Selected values refine displayed in the grid data results.
objects_grid_allowed_types.png

Filter

  • ❌  not specified (default):  extra data filtering is not applied;
  • specified: manually enter an ASQL expression to filter data retrieved to the object relations grid.

A combination of the specified in the Model property group fields are applied one after another and filter out the records to show:

  • Entity class name: retrieves all available services;
  • Allowed Types: retrieved related services are bundles;
  • Filter: retrieved related bundles can be of a specific status only, for example only operational bundles can be shown. 
objects_grid_filter.png

Column definition

the property defines a set of columns displayed in the object's grid heading row. 

  • ❌  not specified (default): displayed in the grid columns are defined by the specified Entity Class Name property of the objects grid; 
  • specified: enter existing Data query name (see Administration application → User Interface → Data Queries).  Specified Data query defines a set of columns to be displayed in the grid, their search mode, sorting, graphics, showing data of a specific range or filtering and other settings defined in a particular Data query.
grid_column_definition.png

Current item

optional property of a data model that acts as a variable. Allows passing the data of a just clicked item of the grid to a specified data model field.

Select the necessary source from a list of suggested data model fields of an Object data type only or create a new Calculated property data source of an Object type and assign  Calculated property  to the  Current Item field:

Example: a row of a grid is edited using a wizard. Current item usage is as follows:

  • click on a record of the grid;
  • the system passes data from the row to an edit page. In this case, data is passed to the Current item;
  • modify data and introduce necessary changes. Changes are made to the field specified in the Current item;
  • save and apply changes. Data from the Current item is passed to the actual data structure of the grid.
grid_current_item_example.png

Common 

Help

help icon and tooltip for information displaying as:

  • ❌  not set: help icon is not displayed;
  • static value: manually entered text displayed in a pop-up window. The text of the prompted message  is edited in a standard text editor and can include plain text, headings, links, and lists;
  • localizable:  plain text specified per each available in the system locale. Shows appropriate localized help message according to the currently selected by the user language profile settings;
  • model: displayed data is retrieved from a specified data model field.

objects_grid_help_icon.png

Help icon with a tooltip displaying example

grid_help.png

Label

title of the grid. Can be set via one of the following options:

  • not selected:  grid title is empty and not displayed;
  • static value: manually entered title of the grid;
  • localizable:  grid title specified per each available in the system locale. Shows appropriate localized  title according to the currently selected by the user language profile settings;
  • model: displayed data is retrieved from a specified data model field.

objects_grid_label.png

Localizable grid label example

grid_label.png

Show label

Check-box options:

  • disabled: the title of the grid is not shown.
  • selected:   grid's title display is enabled. The title is specified in the Label field. 
Disabled clipboard_e0da6a6ec8b063aa682bf127f8fc2b41f.png

Disabled

  • Static value: check-box options
    • disabled (false): search field and all buttons displayed in grid's header row are available;
    • selected (true): header row is displayed but all options like add item, search, pagination, etc. are disabled. Search is the only active field:
      objects_grid-disabled1.png
      Grid header row displaying example: disabled property is set to true.
  • Model: suggests boolean data options from the data model (true/false values)
False grid_disabled.png

Read-only

  • Static value: check-box options
    • disabled (false): all options displayed in the grid's header row are available;
    • selected (true):  header row is displayed but all options except search field and export data button are disabled:
      objects_grid-read_only1.png
      Grid header row displaying example: read-only property is set to true.
  • Model: suggests boolean data options from the data model (true/false values)
False grid_read_only.png

Enable row selection

  • Static value: check-box options
    • selected (true):  the first column of the grid is a column with check-boxes for grid records multiple selection and further processing:
      objects_grid_enable_row_selection1.png
      Enabled row selection displaying example: check-box option is set to true.
    • disabled (false): the first column with check-boxes is not displayed in the grid.
  • Model: suggests boolean data options from the data model (true/false values).
True grid_enable_row_selection.png

Name

automatically generated name or identifier of the grid. 

The only required field for the grid saving, although without properly configured Entity  Class name property the entire grid is poorly displayed.

auto-generated objects_grid_name.png

Appearance

Full Height

Check-box options:

  • disabled: the grid takes only a part of the page's working area and shows 10 first records. Use scrolling for other records preview
  • selected: the grid preview expands and covers the entire available space of the page's working area.
Disabled grid_full_height.png

Minimal Height, px

defines the fixed height of the grid displayed on the page. 

  • not specified (default): grid's height is not restricted;
  • specified: set value measured in pixels, for instance: "100".

The specified height is spread upon the entire grid representation, including grid's header with default buttons area (export, columns preview), grid heading row and displayed records data.

grid_minimal_height.png

Enable Drag-n-Drop

Check-box options:

  • disabled (default);
  • selected:  allows changing the display order of the items in the objects grid.

For proper functioning use enabled Drag-n-Drop property in pair with  Object IDs property of the objects grid.

For instance, changing the ranking of the service catalogs using drag-n-drop property: 

  1. Objects grid with enabled drag-n-drop property;
  2.  Drag and drop the item to change its displaying position in the grid;
  3. Visual change: the item's position in the grid has changed visually, but the changes are not applied to any data, so the displayed entries have not changed;
  4. Data change: specify Object IDs property of the grid and bind an array of record identifiers which should be modified in the application accordingly to the changes applied by drag-n-drop property:

enable_drag_n_drop2.png

Disabled objects_grid_enable_dragndrop.png

Delete actions

manually entered field value: 

  • ❌  not specified (default): selected object cannot be deleted from the system directly using objects grid. Delete selected object(s) button is not shown in the grid's heading row;
  • specified:  choose from the list  of available in the system delete actions:grid_delete_actions.png

For Actions management see  Administration application  → User Interface  → Actions.

As a result, selected delete action allows deleting the displayed item from the grid and directly from the system via Delete selected object(s) button of the objects grid: 

objects_grid_delete_actions.png

delete_actions.png

Disable add

  • Static value: check-box options
    • disabled (false):  new items can be added from a list of existing items. Items that have already been added are not suggested in the list. Items can be added using Add existing item(s) button :
      objects_grid_disable_add.png
      Disable add property is set to false: add button is available
    • selected (true): add button is not shown in the grid header and new records cannot be added.
  • Model: suggests boolean data options from the data model (true/false values). 
False grid_disable_add.png

Disable remove

  1. Static value: check-box options
    • selected (True): remove button or icon is not shown in the grid's heading row and the records cannot be deleted from the grid; 
    • disabled (False): retrieved to the grid items can be removed with a delete button:
      objects_grid_disable_remove.png.
  2. Model: suggests boolean data options from the data model (true/false values). Remove selected link(s) from the objects grid option displaying depends on the current value of a selected record.
False grid_disable_remove.png

Disable create

  1. Static value: check-box options
    • selected (True): create new item button is not shown;
    • disabled (False):  allows creating not only a link with the existing main object but also a new item record directly from the objects grid: 
      objects_grid_disable_create.png
  2. Model:  select source from the data model. The property suggests boolean data options from the data model (true/false values).  Create new item from the objects grid option displaying depends on the current value of a selected record.
True grid_disable_create.png

Hide Grid Header

Check-box options:

  • disabled: grid header is displayed on the page layout. The header includes:
    • the title of the grid ("Label");
    • standard buttons (export, columns displaying settings);
    • extra buttons (delete record, add new record, export all, refresh).
  • selected: header is not displayed, only grid heading row with sortable columns titles and the available in the grid records are shown.
Disabled grid_hide_grid_header.png

Show "Selected items" panel

Check-box options:

  • Static value: check-box options
    • selected (True): "Selected items" panel is shown under the grid area of the layout;
    • disabled (False):  the "Selected items" panel is not used on the page; 
  • Model: suggests boolean data options from the data model (true/false values). 

Selected items panel provides an overview of multiple items selected on different pages of the grid:

selected_items_panel.gif

The panel shows the Display Name of the selected items. The Display Name property value is retrieved from the Configuration Item of the selected object.

False selected_items_grid.png

Visibility

Grid display on the page modes:

  1. Static value: check-box options
    • selected (True): grid displaying on the page layout template is enabled; 
    • disabled (False): the grid is not shown on the page layout template.
  2. Model:  select data model source out of suggested data with boolean type.  The entire grid displaying depends on the current value of a selected record.
True clipboard_ef748af5414dd44fb723697c41161887d.png

Device visibility

Desktop

This property allows improving user experience by managing device visibility options. For instance, the grid can be hidden from the preview when it is too large and contains a lot of columns that cannot fit the small screen of a mobile device.

The application checks the user device's screen resolution and shows or hides grid preview based on the selected check-box options settings:

  • disabled: the grid is not displayed;
  • selected (default): the grid is shown on the page.

device_visibility_objects_grid.png

Device visibility settings example: objects grid is displayed for desktop devices and tablets.

Enabled clipboard_eb901040d88572e905a56dde0cd58b948.png

Tablet 

Enabled

Mobile

Enabled

 

  • Was this article helpful?