Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Insert excerpt
_Banners
_Banners
namescreen
nopaneltrue

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

    Expand
    titleHow?

    Anchor
    CreateView
    CreateView
    This can be configured from your
    Insert excerpt
    _erd
    _erd
    nopaneltrue
     by clicking on the table header, or from a screen that currently displays a view of the data, by right-clicking and choosing 
    Insert excerpt
    _show_table_configuration
    _show_table_configuration
    nopaneltrue
    .

    1. In the 
      Insert excerpt
      _tables
      _tables
      nopaneltrue
      's 
      Insert excerpt
      _property_tabs
      _property_tabs
      nopaneltrue
      , expand the Views section
    2. Click 
      Insert excerpt
      _addIcon
      _addIcon
      nopaneltrue
       to create a new view
    3. Give the view an appropriate name and press
      Insert excerpt
      _save
      _save
      nopaneltrue
      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 
      Insert excerpt
      _attributes_icon
      _attributes_icon
      nopaneltrue
       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 
      Insert excerpt
      _property_tabs
      _property_tabs
      nopaneltrue
      , then press OK
    6. (Optional) On the
      Insert excerpt
      _property_tabs
      _property_tabs
      namestyle
      nopaneltrue
       for the new View, choose or create new styles, if required
      1. See Adding Styling to a Drop-Down View


  2. Insert excerpt
    _pin
    _pin
    nopaneltrue
     either the table or drop-down view tab to keep it open
  3. On a screen containing a
    Insert excerpt
    _grid
    _grid
    nopaneltrue
    , c
    lick on the attribute header for the column where you want to display drop down fields
  4. The View Attribute
    Insert excerpt
    _property_tabs
    _property_tabs
    nopaneltrue
    will open
  5. On the
    Insert excerpt
    _property_tabs
    _property_tabs
    namestyle
    nopaneltrue
    , untick Read Only
  6. On the 
    Insert excerpt
    _property_tabs
    _property_tabs
    nopaneltrue
    , drag across your drop-down view into the Selection View field, found in the Drop Down Settings section of the View Attribute properties

  7. Insert excerpt
    _save
    _save
    nopaneltrue
     the properties
  8. Close and reopen the screen, then 
    Insert excerpt
    _lock
    _lock
    nopaneltrue
     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

    Expand
    titleHow?

    See How? above.


  2. Insert excerpt
    _pin
    _pin
    nopaneltrue
     either the table or drop-down view tab to keep it open
  3. On a screen containing a
    Insert excerpt
    _form
    _form
    nopaneltrue
    fields, c
    lick 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 
      Insert excerpt
      _template_change
      _template_change
      nopaneltrue
    2. Select the Drop Down (Manual) template from the Serene Grey palette
  4. The Drop Down
    Insert excerpt
    _property_tabs
    _property_tabs
    nopaneltrue
    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. Insert excerpt
    _save
    _save
    nopaneltrue
     the properties
  7. Close and reopen the screen, then 
    Insert excerpt
    _lock
    _lock
    nopaneltrue
     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,
    Insert excerpt
    _add
    _add
    nopaneltrue
    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 
    Insert excerpt
    _property_tabs
    _property_tabs
    namestyle
    nopaneltrue