Editable Table

Required result:

• ui::Table with columns with editable values.
• One of the columns contains a drop-down list with the possible options. The options are based on an enumeration.
• The table values are persisted when you click the Submit button.

Resulting form

To create a document or a to-do with such a table, you need to do the following:

1. Create the data type model with a shared record for the persisted entity and the enumeration.
   

   The underlying data type hierarchy
2. Create the form definition.
   1. Create a form variable applicant of the shared record type Applicant: The table will use the variable as its iterator.

   2. In the form, add the Table component and define its properties on the Detail tab:

      1. Set Data Iterator as the reference to the form variable.
      2. Set Data Kind.
      3. Define the Data expression.

      In this pattern, we assume you are using the Data Kind set to Data with the Data expression defined as a closure with two input parameters:{x, y -> getAllApplicants()}

   3. In the table component, insert the Table Column components.

   4. In the columns, add the Input components.

      

      Asset table with columns with two text boxes and one combo box
      In the example, we inserted two Text Boxes and one Combo Box:
      1. On Text Boxes, define the binding to the reference to the iterator fields, for example, &applicant.surname.
      2. On the Combo Box component, define the binding to the iterator field and the options to be displayed in the drop-down area.

      To bind options to the enumeration, convert the enumeration literals to options. You can do so using the collect() and literalToName() functions.

      collect(literals(type(Level)),
             {e -> new ui::Option(value -> e,
                                  label -> literalToName(e))})

   5. Define the Submit button:
      1. Insert the Button component into the form.
      2. Create ActionListener on it.
      3. On the listener properties, select the Submit action on the Actions tab.
   6. Optionally, set the text that should be displayed in the table if it contains no entries: on the Presentation Hint tab of the table properties, add the no-data-message hint.
3. Create a document or a process with a to-do that uses the form.