Tree Element

The Tree element is used to design a hierarchy or a category. There are options to configure nodes that allows you to change the design of the form in the desired format.

Figure 1 Tree Element - Data

NOTE:The Preview area displays how the form would render on making the changes or edits to any field.

The following fields are populated in the Data tab.

Data Source Type: Select the type of data source, that is JSON or URL.

The following fields appear when the Data Source Type is JSON:

Data Source Raw JSON: Each node configuration is displayed in a JSON file. You must have the following details mentioned:

dn: It is a unique ID that defines the selected node. The value must be a string. This is the data value for the tree element that you add and is passed to the workflow.

name: Enter the name you wish to be displayed on the User Interface. The value must be a string.

data: (Optional) This saves the metadata to the existing field.

subcontainers: It defines the child node.The value must be an array of JSON. Each element of the array is an object following the same structure as that of a node.

icon: The image class to be used for displaying icon on each node. The value must be a string. If you do not define the value, the node uses the image class selected in Default Icon Class under the Display tab.

NOTE:All nodes must follow either JSON or customized data structure. The parent and child cannot be of different structure.

If JSON does not follow the default structure, it must be mapped accordingly.

Mapper keys for URL response: Allows you to map the JSON parameters with the URL element parameters.

You can use the Mapper keys for URL response/ Raw JSON setting to customize the field names provided under Data Source RAW JSON.

For example, if you want the field names as ["id","display","description","child","icon"], then modify the details under Mapper keys for URL response/ Raw JSON as follows:

{ dn: "id", name: "display", data: "description", subContainers: "child", icon: "icon"}

The following fields appear when the Data Source Type is URL:

HTTP method: Select the required http method. For example, GET, POST.

Service ID: Select the appropriate service ID. For example, IDM, IG.

Data Source URL: The URL that returns a JSON array to use as the data source.

Mapper keys for URL response: Allows you to map the JSON parameters with the URL element parameters.

Request Headers: Set any headers that should be sent along with the request to the URL. This is useful for authentication.You can have multiple keys for a parameter, and you can have multiple values for a key.

request payload: Enter the request body for the root node in the request payload field. The request body contains the node details that will be used to load the node. It applies in case of POST method.

lazy parameter: Enter the parameter name that will be used to load a sub-node. The lazy parameter such as nodeid is appended in the data source URL provided by the user. It applies in case of GET method (Lazy Loading).

Default Value: The entered value is displayed in the field before user interaction. Having a default value overrides the placeholder text.

Refresh On: Refreshes data when another field changes.

Clear Value On Refresh: This text appears below the input field.