Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
HTML
HTML
<sx:autocompleter list="{'apple','banana','grape','pear'}" />
Set initial value
Code Block
HTML
HTML

<sx:autocompleter list="{'apple','banana','grape','pear'}" value="apple" />
Force valid option (restore option when focus is lost)
Code Block
HTML
HTML

<sx:autocompleter list="{'apple','banana','grape','pear'}" forceValidOption="true"/>
Using the JSON plugin to generate the values (one of the possible ways)

...

for this autocompleter:

Code Block
HTML
HTML
<s:form id="form">
  <sx:autocompleter name="state" />
</s:form>

The following JSON will be accepted:

...

Code Block
javascript
javascript
titleArray inside object, field in response starts with the name of the autocompleter("state" in this example)
{
    "states" : {[
        ["Alabama" : ,"AL"],
        ["Alaska"  : ,"AK"]
    }]
}     
Code Block
javascript
javascript
titleNo name match, use first array found, and hope for the best
{
    "Australopithecus" : [
       ["Alabama","AL"],
       ["Alaska","AK"]
    ]
}     

...

Reload options when topic is published
Code Block
HTML
HTML

<sx:autocompleter listenTopics="/reload" href="%{#url}" />
Submit form when options are loaded
Code Block
HTML
HTML

<s:form id="form">
  <input type="textbox" name="data">
</s:form>
Code Block
HTMLHTML
<sx:autocompleter listenTopicsformId="/reloadform" href="%{#url}"  />

...

Filter fields top be submitted when options are loaded (return true to include)
Code Block
HTML
HTML

<script type="text/javascript">
  function filter(input) {
     return input.name == "data1";
  }
</script>

<s:form id="formform id="form">
  <input type="textbox" name="data0">
  <input type="textbox" name="datadata1">
</s:form>

<sx:autocompleter formId="form" formFilter="filter" href="%{#url}"  />

...

Link two autocompleters, using topics
Code Block
HTML
HTML
<script<form typeid="text/javascript">
  function filter(input) {
     return input.name == "data1";
  }
</script>

<s:form id="form">
  <input type="textbox" name="data0">
  <input type="textbox" name="data1">
</s:selectForm">
   <sx:autocompleter  name="select" list="{'fruits','colors'}"  valueNotifyTopics="/changed" />
</form>

<sx:autocompleter  href="%{#url}" formId="selectForm" listenTopics="form" formFilter="filter/changed" />
Show options, but don't make suggestion (autocomple) in the textbox
Code Block
HTML
HTML

<sx:autocompleter autoComplete="false" href="%{#url}" />