Typeahead

<TYPEAHEAD/> : FormField

The <TYPEAHEAD/> widget creates a dropdown that contains one or more <OPTION/>'s.

A <TYPEAHEAD/> can be either static or dynamic.

Static <TYPEAHEAD/>'s list all possible <OPTION/>'s as children. Dynamic *<TYPEAHEAD/>'s are created by defining a single prototype <OPTION/> and using the <TYPEAHEAD/>'s data attribute to tie it to a datasource.

Restrictions:

• If populating the <TYPEAHEAD/> from a Datasource using data= ensure to have exactly one <OPTION/> child with bindings matching the data.

Attributes

Name	Type	Default	Description	Req
data	string		The Datasource that populates the OPTION
width	int		The width of the <TYPEAHEAD/>. The default is the size of the largest OPTION child
allowinput	bool	false	If an enterable query is able to be added as a value option upon pressing enter.

Examples

Example #1 : A dynamic TYPEAHEAD populated by datasource using this data.

<FML title="TYPEAHEAD (example1)" linkable="true" layout="column">

 <GET id="MONTHS" url="https://pad.fml.dev/templates/examples/data/monthdata.xml"/>
 
 <TEXT value="Simple Typeahead"/>        
 <TYPEAHEAD id="monthselector" data="MONTHS">
	<OPTION value="{data.month}" label="{data.month}">
	  <TAG value="{data.num}"/>
	  <TAG value="{data.month}" type="startswith"/>
   </OPTION>                
  </TYPEAHEAD>
  
</FML>

(img. a)

See it in Action

Other Widgets You May Find Useful:

• FORM
• INPUT
• CHECKBOX
• RADIO
• SELECT
• Datasources