Grid View

<< Click to Display Table of Contents >>

EQuIS 7  >>  Collect > EQuIS Collect Enterprise > Form Designer Page > Forms and Fields >

Grid View

The Grid View feature allows specified fields to be displayed in a grid view (i.e., table view) on the mobile device. This allows for easy viewing of form records while in the field. The grid view is created while designing the form on the Form Designer page.

Col-Grid_View-Mobile_Display1

 

Grid View Design Considerations

 

An important design consideration is how the grid will display on the mobile device based on screen size. The form will look different on a smart phone compared to a tablet. Therefore, grid column header names should be concise to maximize readability with a limited screen size. In the example below, designing the field parameter grid view with abbreviated field names improves clarity for the user in the field.

 

 

Tablet

Col-Grid_View-Mobile_Example-Long1

 

 

Smart Phone

Col-Grid_View-Mobile_Example-Long2

Tablet

Col-Grid_View-Mobile_Example-Short1

Smart Phone

Col-Grid_View-Mobile_Example-Short2

 

 

How to Add Grid View to a Form

 

There are two ways to assign and set fields to be displayed in Grid View on the form: (1) Use the Grid button on the Form Setup page to open the Grid View Builder window, or (2) use the Attribute Section while editing a field.

 

Grid Button on Form Setup Page

 

To assign fields to the Grid View click on the Grid button in the Form Setup section of the Form Template.

Col-Grid_View-Button

The Grid View Builder window will open. The Field drop-down menu contains all fields in the current Form Template. Select the desired field in the drop-down menu and click the Add button. The field is added to the Grid View Builder with GridValue, GridHeader, and Remove buttons.

Col-Grid_View_Builder

When adding fields to the Grid View Builder, fields will automatically be organized in the same order as in the form template. Once a field has been added to the Grid View Builder, the field will no longer be displayed in the drop-down menu preventing fields from being duplicated in the Grid View.

 

The GridValue button is used to assign how the field value will be displayed and will default with the current field set as the field value. Select the GridValue button to assign value or logic to the specified field using the Formula Builder. Fields with no assigned grid values will be displayed with red text in the Grid View Builder.

Col-Grid_View_Builder-Formula

The GridHeader button is used to assign which grid field will be used as a grid header value. Select the GridHeader button to assign value or logic to the specified field using the Formula Builder.

Col-Grid_View_Builder-Formula_GridHeader

Fields can be removed from the Grid View by selecting the Remove button. The user will be prompted for confirmation prior to removing the field from the Grid View. This action will not delete the field from the form.

 

Edit Field Page

 

Fields can be assigned to the Grid View without using the Grid View Builder. When generating or editing a field, the GridValue and GridHeader buttons are available on the Attributes tab of the Edit Field page. Select the GridValue button and/or GridHeader button to assign value or logic to the specified field using the Formula Builder. Hovering the mouse over either buttons will display the current value.

 

Col-Grid_View-Field_Attribute

 

Fields that have been assigned GridValue and GridHeader values using the Attributes Tab in the Edit Field page will also be displayed in the Grid View Builder.