netui:select Tag

<netui:select> Tag

Renders an HTML <select> tag containing a set of selectable options.

Syntax

<netui:select
    [accessKey="string_accessKey"]
    dataSource="expression_datasource"
    [defaultValue="string_or_expression_default"]
    [disabled="boolean_disabled"]
    [multiple="boolean_multipleSelectEnabled"]
    [nullable="boolean_nullable"]
    [nullableOptionText="boolean_nullableOptionText"]
    [nullableTop="boolean_nullableTop"]
    [onBlur="string_onBlur"]
    [onChange="string_onChange"]
    [onClick="string_onClick"]
    [onDblClick="string_onDblClick"]
    [onFocus="string_onFocus"]
    [onKeyDown="string_onKeyDown"]
    [onKeyPress="string_onKeyPress"]
    [onKeyUp="string_onKeyUp"]
    [onMouseDown="string_onMouseDown"]
    [onMouseMove="string_onMouseMove"]
    [onMouseOut="string_onMouseOut"]
    [onMouseOver="string_onMouseOver"]
    [onMouseUp="string_onMouseUp"]
    [onSelect="string_onSelect"]
    [optionsDataSource="expression_datasource"]
    [size="integer_size"]
    [style="string_Style"]
    [styleClass="string_Class"]
    [tabindex="string_tabIndex"]
    [tagId="string_tagId"] />

Description

Renders an HTML <select> tag containing a set of selectable options.

The <netui:select> tag can generate a set of selectable options in two ways:

  1. they can be dynamically generated by pointing the <netui:select> tag at a String[] object or java.util.HashMap
  2. they can be statically generated by providing a set of children <netui:selectOption> tags

Dynamically Generated Options

You can dynamically generate a set of selectable options by pointing the <netui:select> tag at a String[].

    public String[] _options = {"red", "green", "blue", "orange", "pink", "aqua", "black", "brown", "tan"};

To point the <netui:select> tag at the String[] object use the optionsDataSource attribute.

    <netui:select optionsDataSource="{pageFlow._options}"
Note that you can make the display value and the submitted value differ by pointing the <netui:select> tag at a HashMap object. (Any object that implements the java.util.Map interface will work.)
    public HashMap _hashMap = new HashMap();
  
    protected void onCreate()
    {
        _hashMap.put("#ff3333", "red");
        _hashMap.put("#3333ff", "blue");
        _hashMap.put("#33ff33", "green");
    }
The following HTML will be generated.
      <select size="3">
          <option value="#3333ff">blue</option>
          <option value="#33ff33">green</option>
          <option value="#ff3333">red</option>
      </select>

Statically Generated Options

To statically generate selecable options, place a set of <netui:selectOption> tags inside the <netui:select> tag.

      <netui:select dataSource="{actionForm.selections}" size="5">
          <netui:selectOption value="red" />
          <netui:selectOption value="blue" />
          <netui:selectOption value="green" />
          <netui:selectOption value="yellow" />
          <netui:selectOption value="orange" />
      </netui:select>

Submitting Selections

A <netui:select> is submitted as a String or String[] object, depending on whether the multiple attribute is set to true. In the following example, the dataSource attribute points at a String[] object.

     </netui:select dataSource="{actionForm.selections}">

In this case, the <netui:select> tag submits to a String[] field of a Form Bean.

    public static class SubmitForm extends FormData
    {
        private String[] selections;
      
        public void setSelections(String[] selections)

        {
            this.selections = selections;
        }
      
        public String[] getSelections()
        {
            return this.selections;
        }
    }

Attributes

accessKeyThe keyboard navigation key for the element. The following values are not recommended because they are often used by browsers: A, C, E, F, G, H, V, left arrow, and right arrow
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

dataSource

The dataSource attribute determines both (1) the source of populating data for the tag and (2) the object to which the tag submits data.

For example, assume that the Controller file (= JPF file) contains a Form Bean with the property foo. Then the following <netui:textBox> tag will (1) draw populating data from the Form Bean's foo property and (2) submit user defined data to the same property.

    <netui:textBox dataSource="{actionForm.foo}" />

The dataSource attribute takes either a data binding expression or the name of a Form Bean property. In the above example, <netui:textBox dataSource="foo" /> would have the exactly same behavior.

When the tag is used to submit data, the data binding expression must refer to a Form Bean property. In cases where the tag is not used to submit data, but is used for displaying data only, the data binding expression need not refer to a Form Bean property. For example, assume that myIterativeData is a member variable on the Controller file ( = JPF file). The following <netui-data:repeater> tag draws its data from myIterativeData.

    <netui-data:repeater dataSource="{pageFlow.myIterativeData}">

 
RequiredSupports runtime expression evaluationData bindable
YesNoRead / Write

defaultValue

Use in <netui:checkBoxGroup>, <netui:checkBox>, <netui:radioButtonGroup>, and <netui:select> tags

Sets the preselected value or values.

The defaultValue attribute takes either a String literal or a data binding expression.

If the defaultValue attribute has a String value (or if the data binding expression points to a String), then a single value will be preselected.

If the defaultValue attribute points to a String[] object (or any object which can be iterated over), then multiple values will be preselected.

Use in <netui:textArea> and <netui:textBox> tags

Sets the initial display text.

The defaultValue attribute takes either a String literal or a data binding expression that points to a String.

 
RequiredSupports runtime expression evaluationData bindable
NoNoRead / Write

disabledBoolean. If set to true, the button will be visible, but diabled.
 
RequiredSupports runtime expression evaluationData bindable
NoNoRead Only

multipleBoolean. Whether or not multi-selection is enabled. If multiple selection is enabled, a null option will not be displayed, even if the nullable is set to true.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

nullableBoolean. Whether a option with the value null should be added to the bottom of the list. If <select> has the multiple attribute set to true, the null option won't be shown.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

nullableOptionTextBoolean. If the nullable attribute is set to true, then the nullableOptionText attribute determines the display text of the null option. The default is to use the empty string, "", as the display text.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

nullableTopBoolean. If set to true, the null option will be at the top of the list
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

onBlurThe onBlur JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onChangeThe onChange JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onClickThe onClick JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onDblClickThe onDblClick JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onFocusThe onFocus JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onKeyDownThe onKeyDown JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onKeyPressThe onKeyPress JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onKeyUpThe onKeyUp JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onMouseDownThe onMouseDown JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onMouseMoveThe onMouseMove JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onMouseOutThe onMouseOut JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onMouseOverThe onMouseOver JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onMouseUpThe onMouseUp JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

onSelectThe onSelect JavaScript event.
 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

optionsDataSource

The optionsDataSource attribute determines the set of options presented to the user.

In a <netui:select> tag, the options are rendered as a set of <netui:option> tags.
In a <netui:checkBoxGroup> tag, the options are rendered as a set of <netui:checkBox> tags.
In a <netui:radioButtonGroup> tag, the options are rendered as a set of <netui:radionButton> tags.

The options can be determined dynamically by pointing the optionsDataSource at a String[] object or an object that implements java.util.Map. In either case, a set of options will be rendered based on the content of the String[] or java.util.Map object. One option will be rendered for each element in the String[] or for each entry in the java.util.Map.

If a java.util.Map object is used, the display name and underlying value of each option may be set independently. (The display name will be rendered based on the value of each Map entry; the underlying value will be rendered based on the key of each Map entry.) If a String[] object is used, the display name and underlying value of each option will be identical. See the Description and Sample sections of this topic for details.

Use a data binding expression to point the optionsDataSource at the String[] or java.util.Map object. For instance, assuming that myStrArr is a member variable of the Controller file (= the JPF file), then the following optionsDataSource points at myStrArr.

    optionsDataSource={pageFlow.myStrArr}

 
RequiredSupports runtime expression evaluationData bindable
NoNoRead Only

sizeThe number of visible options
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

styleThe style of the rendered HTML tag.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

styleClassThe class of the rendered HTML tag.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

tabindexThe tabIndex of the rendered HTML tag. This attribute determines the position of the tag in the sequence of page elements that the user may advance through by pressing the TAB key.
 
RequiredSupports runtime expression evaluationData bindable
NoNoNo

tagId

String value. Sets the id (or name) attribute of the rendered HTML tag. Note that the real id attribute rendered in the browser may be changed by the application container (for example, Portal containers may change the rendered id value to ensure the uniqueness of id's on the page). In this case, the real id rendered in the browser may be looked up through the JavaScript function getNetuiTagName( tagId, tag ).

For example, assume that some tag's tagId attribute is set to foo.

    <netui:textBox tagId="foo" />

Then the following JavaScript function will return the real id attribute rendered in the browser:

    getNetuiTagName( "foo", this )

To get a <netui:form> element and all of its children elements in JavaScript, use the same JavaScript function getNetuiTagName( tagId, tag ). For example, assume that there is a <netui:form> whose tagId attribute is set to bar.

    <netui:form tagId="bar" >

Then the following JavaScript function will return the <netui:form> element and its children (packaged as an array).

    document[getNetuiTagName( "bar", this )]

To retreive the value entered into a <netui:textBox> within the <netui:form> tag, use the following JavaScript expression.

    document[getNetuiTagName("bar", this)][getNetuiTagName("foo", this)].value

The second parameter ensures that the JavaScript function begins its search within the correct Portlet scope. Pass the JavaScript keyword this as the second parameter. For detailed information on using the function getNetuiTagName( tagId, tag ) see Using JavaScript in Page Flow and Portal Applications.

 
RequiredSupports runtime expression evaluationData bindable
NoYesNo

Sample

The following sample uses the optionsDataSource attribute to reference a dynamically generated dropdown list.
 <netui:select dataSource="{actionForm.selectedOption}"
     optionsDataSource="{actionForm.itemOptions}" />
 

Assume that the optionsDataSource attribute refers to a java.util.Map object. The Map object will be rendered as a series of <option> tags. HTML that is similar to the following will be rendered in the browser:

    <select>
        <option value="633">Aurora Bridge</option>
        <option value="631">FA-18 fighter jet</option>
        <option value="635">Space Needle</option>
        <option value="642">Thin Mints</option>
	      ...
    </select>

Sample Code

[BEA_HOME]/weblogic81/samples/workshop/SamplesApp/WebApp/tagSamples/select/

[BEA_HOME]/weblogic81/samples/workshop/SamplesApp/WebApp/handlingData/dropdown/

Related Topics

<netui:select> Tag Sample

Dynamically Populating the Options in a Dropdown Sample

<netui:selectOption> Tag