Dropdown

Use dropdown lists in Custom UI Widget

Input combo type dropdown.list

Displays a drop-down menu that allows selecting a single option.

Usage example

<form>
    <inputcombo
        type='dropdown.list'
        id='variable_from_list'
        label="Select a variable"
        description="Select a common variable from all devices"
        placeholder='Choose an option'
        value="temperature"
    >
       <menu>
            <item id='temperature'>Temperature</item>
	    <item id='humidity'>Humidity</item>
	    <item id='iluminance'>Iluminance</item>
	    <item id='magnetic_flux'>Magnetic flux</item>
      </menu>
    </inputcombo>

</form>

Properties

  • id: Unique identifier to access this field's data

  • label: Header text

  • description: Short descriptive text

  • placeholder: Placeholder value

  • shape: Used to align the label and the input field. Its allowed values are

    • compactVertical

    • wideVertical

    • wideHorizontal

  • value: Set a default value from the defined menu items. This value must be the id of only one of the defined menu options, otherwise the behavior will be as if no default value were set and the placeholder will be displayed.

Option's properties

id: Unique identifier to access the selection's value.

Last updated