List

A list allows the user to select individual or multiple items from a given set of values.

The list is populated using a 1010data query. The 1010data query associated with the widget should generate one or two columns (i.e., either values or values and labels).

Label
The text that is displayed above the list.
Width of label
The number of pixels allocated for the text above the list.

If the text of the label is greater than the width specified, the label is truncated.

Width of list
The number of pixels allocated for the width of the list.

If the text of the items in the list cannot be displayed in the width specified, a horizontal scroll bar will be added to the list widget.

Height of list
The number of pixels allocated for the height of the list.

If the total number of items in the list cannot be displayed in the height specified, a vertical scroll bar will be added to the list widget.

The default is 280px.

Variable for value
The variable to hold the selections from the list as a comma-separated string.

You may select a variable from the dropdown, or you can create a new variable by clicking New... and entering the name in the field following the @ symbol.

List variable for value
The variable to hold the selections from the list as a list-value.

You may select a variable from the dropdown, or you can create a new variable by clicking New... and entering the name in the field following the @ symbol.

This variable will store the selections as elements in a list-value. The elements may be accessed via dot notation. For example, if you specified the variable @selected_value in the List variable for value field, you can access the second item in the list-value using the notation {@selected_value.2}.

For more detailed information on working with list-values, see the 1010data Reference Manual.

It is recommended that you use List variable for value over Variable for value, particularly if the items in your list contain commas.

Note: If a List variable for value is specified, the Variable for value will be ignored.
Text color
The color of the text of the items in the list.
The color can be selected using the color picker or can be specified as:
  • Any valid HTML color name (e.g., red, blue, cyan)
  • An RGB value (e.g., rgb(238,147,12))
  • A hex value (e.g., #d12345)
Text style
The appearance of the text in the list.

When this field gets focus, a dialog is presented that allows the user to select the family, style, size, and other characteristics of the text such as letter spacing and underlining.

Example

<note type="base">Applied to table: pub.demo.retail.item</note>
<dynamic selected_value="98A,3B7,A96">
  <widget base_="pub.demo.retail.item" class_="list" label_="Choose SKUs:" 
labelwidth_="150" listheight_="200" listwidth_="80" name="hmadded__1" relpos_="202,99" 
textstyle_="font-weight:400;letter-spacing:0;font-family:Impact,Charcoal,sans-serif;font-size:18px;" 
value_="@selected_value">
    <willbe name="selection" value="g_first1(sku;;)"/>
    <sel value="selection=1"/>
    <colord cols="sku"/>
  </widget>
  <widget class_="text" name="hmadded__2" relpos_="453,102" 
text_="Selected SKUs: {@selected_value}"/>
</dynamic>

Example

<note type="base">Applied to table: pub.demo.retail.item</note>
<dynamic selected_value_list="{lst('98A','3B7','A96')}">
  <widget base_="pub.demo.retail.item" class_="list" label_="Choose SKUs:" 
labelwidth_="150" listheight_="200" listvalue_="@selected_value_list" 
listwidth_="250" name="hmadded__5" relpos_="155,92" textcolor_="red" 
textstyle_="font-weight:400;letter-spacing:0;font-family:Georgia,serif;font-size:12px;">
    <willbe name="selection" value="g_first1(sku;;)"/>
    <sel value="selection=1"/>
    <link table2="pub.demo.retail.prod" col="sku" col2="sku"/>
    <colord cols="sku,itemdesc"/>
  </widget>
  <widget class_="text" name="hmadded__3" relpos_="495,97" 
text_="Selected value list: {@selected_value_list}"/>
  <widget class_="text" name="hmadded__4" relpos_="495,152" 
text_="Second value: {@selected_value_list.2}"/>
</dynamic>