Jelix 1.6.37

autocompleteajax_htmlFormWidget extends WidgetBase
in package

Widget allowing to select a value by showing results from a search after the user start to type a name. The search is made by doing an http request to the server. See jAutocompleteAjax jqueryui plugin, which is base on the autocomplete plugin.

You should use a menulist control, and a datasource, inheriting from jFormsDaoDatasource or jFormsDynamicDatasource, and having a getData() method returning an empty list.

The widget accepts a specific attribute, 'attr-autocomplete', an array which should contains at least an item 'source' indicating the url of the search engine. The array may contains other attributes for the input element used to type the search term (class, style..).

example of use:

In the form file:

    <menulist ref="mylist"> <label>test</label>
    <datasource class="mymodule~mydatasource"/>
    </menulist>

The datasource:

class mydatasource extends jFormsDaoDatasource {
   function __construct($formId) {
      parent::__construct ("mymodule~myDao" , "findAll" , "label", 'id');
   }
   public function getData($form) { return array(); }
 }

In a template:

{form $form, $submitAction, $submitParam, 'html', array('plugins'=>array(
     'mylist'=>'autocompleteajax_html'))}

{formcontrols}
   ... {ifctrl 'mylist'}{ctrl_control '', array(
         'attr-autocomplete'=>array('style'=>'width:40em;',
             'source'=>$searchUrl))}
       {else}{ctrl_control}{/ifctrl}
{/formcontrols}

Table of Contents

outputControl()  : mixed
outputJs()  : mixed

Methods

Search results