JSON Form List Detail Views

Description

How to use a JSON Form as the Detail View for a List Control, including pre-defined layouts, auto-generated layouts (server/client), and field mapping.

Using a JSON Form as the Detail View for a List

You can specify that the Detail View for a List is a JSON Form. The JSON Form itself can either be pre-defined (i.e. designed by you), or it can be generated automatically.

When you generate the form automatically, you have the choice of generating the JSON Form client-side or server-side.

If every row in the List has the exact same structure (as is typically the case when the List is based on a SQL query), then there is no benefit in generating the JSON Form client-side. However, if some of the rows in the list have different structures (as might be the case if the List is based on a NoSQL database), then using the client-side option means that the JSON Form matches the structure of the List data for the selected row.

To set a JSON Form as the List Detail View, select JSONForm at the DetailView type property.

Then specify if the JSON Form is pre-defined, or generated automatically, by selecting an option for the JSON Form definition property. The options for this property are:

• Pre-defined
• Auto-generated-server-side
• Auto-generated-client-side

List detail view using a JSON Form

Using the FieldMap Option with JSON Forms in a List with a Detail View

When you set the Detail View type to a JSON Form, you pick a single JSON Form as the List's Detail View.

However, if you set the Detail View type of FieldMap you can map List fields to individual controls in any JSON Form in the UX component.

For example, in the image below, the CustomerID List column can be mapped to the CustomerID control in JSON Form 'JForm1'. Similarly, the City List column can be mapped to the City control in JSON Form 'jform2'.

FieldMap mappings to JSON Form controls

See Also

• JSON Forms
• Data Driven JSON Forms
• Responsive Layouts
• Computed and Summary Fields