midoriAutoComplete

midoriAutoComplete allows the auto completion of text input fields by querying the server in the background. Multiple entries separated with a separator like a comma (,) is possible. Users can select suggestions returned by the server either with the mouse or arrow keys.

midoriAutoComplete(vars)

Offers suggestions and auto completes text input fields by querying the server.
Accepts the following parameters:
- id is the id of the input text field.
- minChars is the minimum number of characters that need to be typed before querying the server.
- separator defaults to nothing. If you specify one (e.g. ','), a user can enter multiple entries by separating them with the separator, each of which are treated independently.
- suggestionClass is the CSS class used to display suggestions.
- suggestionSelectedClass is the CSS class used to display a suggestion selected by the user.
- fileName is the path of the file that requests will be sent to via an AJAX request.
- params is the params that will be passed to the file. The text snippet entered by the user will be appended to the end.
- htmlTemplate is an optional HTML template that you can use to customize the appearance of suggestions.
- callback is an optional callback function to be called when a snippet is selected. The select snippet will be passed to this function.
Example:
```
var autoComplete = new midoriAutoComplete( {
   id:                      'username',
   minChars:                2,
   separator:               ',',
   suggestionClass:         'suggestion',
   suggestionSelectedClass: 'suggestion suggestion-selected',
   fileName:                '/index.php',
   params:                  'do=get_user_names&prefix='
} );
```
The output from the server must be in JSON format, and contain two members: 'snippet' and 'result'. For example for snippet 'cl', the server may return the following values: 'John' and 'Johnson'. The member names or array keys are ignored ('16' and '4' in this case).
```
{
   'snippet': 'Jo',
   'result':  { '16': 'John', '4': 'Johnson' }
}
```
If you provide an HTML template, any extra key-value pairs in result are passed to your template, and the result is put inside the suggestion link.
Example:
```
<img src=":user_avatar" style="border: none" /> :user_name
```
Many server-side scripting languages provide functions or classes to convert native array data to JSON format. If you use PHP and your installation does not contain JSON support, you can use PHP2JSON.