Location: A review of cardiac cellular electrophysiology models @ a80b964384c0 / dojo-presentation / js / dojo / dijit / tests / form / test_FilteringSelect.html

Author:
David Nickerson <nickerso@users.sourceforge.net>
Date:
2010-05-04 12:37:19+12:00
Desc:
adding initial version of SED-ML L1V1 file reproducing what is in graphs/BR-INa-variants.xml
Permanent Source URI:
https://models.cellml.org/workspace/a1/rawfile/a80b964384c0c7683d7c5d07b73a5af7a973d46c/dojo-presentation/js/dojo/dijit/tests/form/test_FilteringSelect.html
Compare... Download Source

Dojo FilteringSelect Widget Test

The FilteringSelect widget is an enhanced version of HTML's <select> tag.

Similar features:

  • There is a drop down list of possible values.
  • You can only enter a value from the drop down list. (You can't enter an arbitrary value.)
  • The value submitted with the form is the hidden value (ex: CA),
  • not the displayed value a.k.a. label (ex: California)

Enhancements over plain HTML version:

  • If you type in some text then it will filter down the list of possible values in the drop down list.
  • List can be specified either as a static list or via a javascript function (that can get the list from a server)

FilteringSelect #1: inlined data, autoComplete=false, required="false":

state list 1: Alabama Alaska American Samoa Arizona Arkansas Armed Forces Europe Armed Forces Pacific Armed Forces the Americas California Colorado Connecticut Delaware District of Columbia Federated States of Micronesia Florida Georgia Guam Hawaii Idaho Illinois Indiana Iowa Kansas Kentucky Louisiana Maine Marshall Islands Maryland Massachusetts Michigan Minnesota Mississippi Missouri Montana Nebraska Nevada New Hampshire New Jersey New Mexico New York North Carolina North Dakota Northern Mariana Islands Ohio Oklahoma Oregon Pennsylvania Puerto Rico Rhode Island South Carolina South Dakota Tennessee Texas Utah Vermont Virgin Islands, U.S. Virginia Washington West Virginia Wisconsin Wyoming onChange:

FilteringSelect #2: url, autoComplete=true:

state list 2: Value:

FilteringSelect #3: url, autoComplete=false:

state list 3: Value:

FilteringSelect #5: custom labelFunc (value in textbox should be lower case when onChange is called), autoComplete=true:

state list 5:

FilteringSelect #7: Input method editor Chinese characters

Using an input method editor (see IME for Windows) try typing 阿 (a) or 把 (ba).

Chinese list: 阿 把

FilteringSelect #8: Japanese

Try typing 東、西、北、南 (north, south, east west) and a few choices will pop up.

Japanese list: 南北 東西 東京 東口 西口 南口 北口 東区 西区 南区 北区 Value:

FilteringSelect #9: No data

This FilteringSelect has no options to choose from. It should still load.

empty list:

FilteringSelect #10: hasDownArrow=false:

no arrow list:

FilteringSelect #11: deep data, initial query of type=country:

query list:

FilteringSelect #12: special characters

The drop down list should be:

  • sticks & stones
  • rags --> riches
  • more\less
  • 3 * 5
Special chars: sticks & stones rags --> riches more\less 3 * 5

this is some text below the combo boxes. It shouldn't get pushed out of the way when search results get returned. also: adding a simple combo box to test IE bleed through problem:

test for IE bleed through problem