Add list of objects to datatable

Function: Add list of objects to datatable

This action allows you to dynamically populate a Data Table component on your application page with a list of items. You can add new data, clear existing data before adding, and control the visibility of the unique identifier column for each item.

Input

• UI element (Data Table): This is the specific Data Table component on your page where you want to add the list of items. (Required)
• Objects: This is the list of items you want to display in the Data Table. Each item in the list should have properties (like "Name", "Price", "Status", etc.) that will become columns in your table. (Required)
• Clear datatable: Choose "Yes" if you want to remove all existing rows from the Data Table before adding the new list of items. Choose "No" to append the new items to the existing ones. (Default: No)
• Hide the identifier column: Choose "Yes" if you want to hide the automatically generated 'ID' column that uniquely identifies each row. Choose "No" to make this column visible. (Default: Yes)

Output

This action directly updates the specified Data Table component on your application page. It does not produce a separate output value.

Execution Flow

Real-Life Examples

• Example 1: Displaying a list of products

  • Scenario: You have a list of products retrieved from a database and want to display them in a Data Table on your "Products" page.
  • Inputs:
    • UI element (Data Table): Products_Table (a Data Table component on your page)
    • Objects: [\{"id": "P001", "name": "Laptop", "price": 1200, "stock": 50\}, \{"id": "P002", "name": "Mouse", "price": 25, "stock": 200\}] (a list of product items)
    • Clear datatable: Yes
    • Hide the identifier column: Yes
  • Result: The Products_Table on your page will be cleared, and then populated with two rows: one for "Laptop" and one for "Mouse". Columns for "name", "price", and "stock" will be created if they don't exist, and the 'ID' column will not be visible.

• Example 2: Appending new customer inquiries

  • Scenario: A customer fills out an inquiry form. After submission, you want to add this new inquiry to an existing Data Table that lists all inquiries, without removing the previous ones.
  • Inputs:
    • UI element (Data Table): Inquiries_Table (a Data Table component on your page)
    • Objects: [\{"id": "I005", "customerName": "Alice Smith", "subject": "Product Inquiry", "date": "2023-10-26"\}] (a list containing the new inquiry)
    • Clear datatable: No
    • Hide the identifier column: No
  • Result: The Inquiries_Table will retain its existing rows. A new row for "Alice Smith" will be added to the bottom of the table. The 'ID' column (showing "I005") will be visible, along with "customerName", "subject", and "date" columns.

• Example 3: Updating a project task list

  • Scenario: You have a Data Table showing project tasks. After a user filters the tasks, you want to refresh the table with the filtered list, ensuring the unique task IDs are visible for reference.
  • Inputs:
    • UI element (Data Table): Project_Tasks_Table (a Data Table component on your page)
    • Objects: [\{"id": "T003", "taskName": "Review designs", "status": "In Progress", "dueDate": "2023-11-01"\}, \{"id": "T007", "taskName": "Prepare presentation", "status": "Not Started", "dueDate": "2023-11-15"\}] (a filtered list of tasks)
    • Clear datatable: Yes
    • Hide the identifier column: No
  • Result: The Project_Tasks_Table will be cleared of all previous tasks. It will then display the two filtered tasks: "Review designs" and "Prepare presentation". The 'ID' column (showing "T003" and "T007") will be visible, along with "taskName", "status", and "dueDate" columns.