Grouping Data under a Table

  1. Select the Table element.
  2. Under the data rows in Table, add the Collapse element from the Interactive category in the Elements panel in the UI Design module.
  3. Create a SQL Action for the corresponding table.

Creating SQL Action

  1. Click the + icon next to the Actions heading in the left panel.
  2. Select New SQL Action from the drop-down menu.
  3. Write your SQL query via SQL Editor and click CREATE.
  4. You can get suggestions from Kuika AI assistant by activating the Generate with AI option.
  1. You can view, rename and delete the action you created in the left panel.
  2. To make edits, click on the action and select Edit.
  3. You can edit existing SQL queries and update them with the Update button.
  4. Use Delete to delete the action.

Collapse Layout

  1. In the Collapse element, specify the field to group.
  2. For example, if you want to group customer information, select the customer name as the header.
  3. In Collapse, add the required fields for detailed data.
  4. Each row of the table represents a customer.
  5. When the row is expanded, the detailed list of customer orders becomes visible.