Data Binding with Nested Structure in Data Elements

1. After logging in to Kuika platform, open the project you will work on from the “Apps” screen.

2. In the “UI Design” (1) module, drag and drop the “Table” (3) element from the “Elements” (2) panel on the left side.
3. Then drag and drop another Table element inside the Table element.
   

At this stage, you can drag and drop Gallery View or Flex Grid elements into the Table element instead of the Table element.

At most one Table, Gallery View or Flex Grid element can be added inside a Table element.

Thus, you have created a nested table with nested elements.

1. After logging into the “Data Sources” module, click on the “+” icon next to “Sources” on the left side.
2. You can connect the data source with Rest API or C#.
3. After selecting the data source, click on the “CREATE” button.
   

Data cannot be bound to nested data elements with other data sources (e.g. MSSQL DB, Swagger, Bluetooth, AI Actions).

1. While in the “UI Design” module, open the “Properties” panel on the right side.
2. After clicking on the main Table element, select the data connection from the “Data Sources” drop-down menu. (For example; customer list)

3. Click on the second Table element you added inside the main Table element and select a data connection from the “Data Sources” drop-down menu in the “Properties” panel. This data source should be another list inside the main Table element (for example, select the list of addresses in the customer list).
   

3. Finally, you can preview your application by clicking the “RUN” button in the upper right corner.