Adding a Drop-Down

Introduction

Drop-downs can be added to grids or form fields on screens using a dedicated view. The below image shows a drop-down on a grid.

Drop-downs can be styled to suit your needs, including row colours, row heights and mouse-over colours, see Adding Styling to a Drop-Down View.

Create a Drop-Down on a Grid

  1. Create a view containing the data you wish to display in your drop-down list

     How?

    This can be configured from your  ERD by clicking on the table header, or from a screen that currently displays a view of the data, by right-clicking and choosing  Show the Table Configuration.

    1. In the  Table's  Properties tab, expand the Views section
    2. Click  to create a new view
    3. Give the view an appropriate name and press  Apply
      1. We recommend the view name is prefixed with DD_ to indicate it's for a drop-down
    4. In the View Attributes section, select the  icon to open the Available Attributes selector
    5. Drag across the attributes you wish to see in the drop-down view into the View Attributes section on the  Properties tab, then press OK
    6. (Optional) On the  Styles tab for the new View, choose or create new styles, if required
      1. See Adding Styling to a Drop-Down View
  2.  Pin either the table or drop-down view tab to keep it open
  3. On a screen containing a  Grid, click on the attribute header for the column where you want to display drop down fields
  4. The View Attribute  Properties tab will open
  5. On the  Styles tab, untick Read Only
  6. On the  Properties tab, drag across your drop-down view into the Selection View field, found in the Drop Down Settings section of the View Attribute properties

  7.  Apply the properties
  8. Close and reopen the screen, then  Lock the screen to see the changes

Create a Drop-Down on a Form

  1. Create a view containing the data you wish to display in your drop-down list

     How?

    See How? above.

  2.  Pin either the table or drop-down view tab to keep it open
  3. On a screen containing a  Form fields, click on the drop-down field where you want to display the drop down
    1. If your field is not configured as a drop down, right-click it and choose  Change Template
    2. Select the Drop Down (Manual) template from the Serene Grey palette
  4. The Drop Down  Properties tab will open
  5. In the Basic Settings section of the View Attribute properties, make the following changes:
    1. Drag across your drop-down view into the View Name field

    2. In the Drop Down Value Field, enter the name of the attribute from your drop down view that you want to display in the field 

  6.  Apply the properties
  7. Close and reopen the screen, then  Lock the screen to see the changes

Dynamically Update Form Fields After Drop-Down Selection

Multiple form fields can be dynamically updated depending on the option a user selects in a drop-down field. In the example below, a user selects a customer from the Customer Number drop down field and the fields, Customer First Name, Customer Last Name and Customer Email Address, are dynamically updated.

  1. Follow the above steps to create a drop-down on a form
  2. In the Drop-Down component properties, in the Mappings section,  Add New mappings to link the data and fields
    1. Assign each Form Field (field name on the screen) to a Drop Down Field (attribute name)
  3. (Optional) For each field being updated dynamically, enabled Read Only in the  Styles tab