If you use a data grid element in a custom form, the data that is presented in the table might be manually provided.

Provided CSV data example

In this use case, you have a table of values that you provide in the custom request form. You provide the information in the table as a constant value source. The source is based on a CSV data structure where the first row defines the grid headers. The headers are the column IDs separated by a comma. Each additional row is the data that appears in each row in the table.

  1. Add the Data Grid generic element to the design canvas.
  2. Select the data grid and define the values in the properties pane.
    Properties pane for the data grid
    Label ID Type
    Username username String
    Employee ID employeeId Integer
    Manger manager String
    Define the CSV values.
    username,employeeId,manager
    leonardo,95621,Farah
    vindhya,15496,Farah
    martina,52648,Nikolai
  3. Verify that the data grid displays the expected data in the request form.
    Data grid in the custom request form

External Source Example

This example uses the previous example but the values are based on a vRealize Orchestrator action. Although this is a simple action example, you can use a more complex action where you retrieve this information from another database or system.

  1. In vRealize Orchestrator, configure an action, getUserDetails, with an array similar to the following example.
    vRealize Orchestrator action to populate a custom form data grid
    1. On the General tab, enter the name getUserDetails and provide a Module name.
    2. On the Script tab, use the following script example.
      return [{"username":"Fritz", "employeeId":6096,"manager":"Tom"}]
    3. In the Return type area, enter or select Properties as the type, and click Array.
    4. Version and save the action.
  2. In Service Broker, add the data grid and use the Values tab to configure the data grid columns with the following values.
    Label ID Type
    Username username String
    Employee ID employeeId Integer
    Manager manager String
  3. In the Default value, Value source list, select External source.
  4. In Select action, enter getUserDetails and select the action you created in vRealize Orchestrator.
  5. Save the form.
  6. In the catalog, verify the table in the request form.
    Data grid populated by vRealize Orchestrator action

Inspecting complex values in data grids

You can examine data grid rows in a separate modal, where complex values are displayed as expandable tree nodes.

The values in the first column of the data grid are links. Click the link to view detailed information about the value in the row you want to examine.

The following table provides information about how different value types are displayed in the table.

Value type Displayed as
Boolean true/false string
Non-complex value label:value pair
Complex value
  1. If the value is an array of objects, {objects.count} objects is displayed. If the array has only 1 element, object is displayed in the cell.
  2. If the object has 2 or fewer properties, none of which is complex, the label:value pairs are separated by a comma and displayed in the cell as Object, object.
  3. If the object has more than 2 properties, or has a complex property, object is displayed in the cell.
Array of complex values {length of array} objects
Empty value hyphen (-)
If the data grid contains only one column, the hide/show control in the footer is not displayed.