Design a List

Design a new list within your Joget environment to streamline data handling and improve user interaction. The process from defining the initial list parameters to the final saving and customization is clear and adaptable.

Create a new list

Begin designing your list by following these steps:

1. Go to the App Composer page.
2. In the Design App page, create a new List using the + button on the List Builder column.
   
3. Enter the List details:
   • ID: Unique ID to represent this entity.
     
     Naming convention
     A standard naming convention is highly recommended to be used across the development of your App to maintain consistency and ease maintenance works.
     Camel case naming convention is recommended for this field.
     Example: travelRequestList
   • Name: Name to represent this entity.  
     
     Example
     Travel Request List
   • Description: Entity description (OPTIONAL)
   • Duplicate List from: With the above information filled up, one can choose to clone the design from the existing list entity.
     
     
     
4. Click Save to create the List. As a result, the List Builder will be launched in a new window.

Select source of data.

1. In the List Builder's Source page, in source of data select Form Data. This binder allows the list to populate based on data captured from Joget forms.
   

2. Select a form from which to source data. For this example, select the Travel Request Form.
   

Design the list

1.  To design your List, click the Design button at the top of the page. All available columns from the data source are listed on the left. Drag and drop the desired columns to design your List.

2. When you click a column,  buttons appear giving you options to move right/left or delete the column, and open Properties that you can modify.

   

3. Click Preview to check how the list looks.
4. Click Save when you finish creating the list.

The video below provides a visual representation of the steps mentioned previously.