kivitendo/templates/webpages/generic/autocomplete.html @ dfee9199
6be015fa | Sven Schöling | [%#-
|
||
Autocompletion
|
||||
This template enables auto completion for input fields.
|
||||
Calling Syntax is:
|
||||
6b6781c5 | Sven Schöling | INCLUDE 'generic/autocomplete', [
|
||
6be015fa | Sven Schöling | { SPEC_1 },
|
||
{ SPEC_2 },
|
||||
...
|
||||
]
|
||||
where SPEC is a hash containing the following keys:
|
||||
script : the script that is called for autocompletion, defaults to the invoking script
|
||||
action : action in the ajax script, defaults to 'ajax_autocomplete'
|
||||
6b6781c5 | Sven Schöling | selector : a jquery selector, specifying the input fields
|
||
6be015fa | Sven Schöling | column : specifies the column that is represented by the bound field. typically description or name.
|
||
d8133a85 | Sven Schöling | params : additional params that should be included in the request, like customer/vendor information. expects a hash.
|
||
6be015fa | Sven Schöling | |||
TODO FIELDS:
|
||||
- addition fields like type, vc etc.
|
||||
- additional dependencies, see jquery.autocomplete documentation
|
||||
- hook function on select, again see jquery documentation
|
||||
d8133a85 | Sven Schöling | - limit: maximum number of results shown.
|
||
6be015fa | Sven Schöling | |||
a simple SPEC would look like this:
|
||||
{ selector => '#description', column => 'description' }
|
||||
# field with id="description" should be autocompleted with descriptions
|
||||
{ script => 'ic.pl', selector => '[name^="partnumber_"]', column => 'partnumber' }
|
||||
# let ic.pl autocomplete by partnumbers, bind this to all fields where the name begins with "partnumber_"
|
||||
The Backend Side
|
||||
The called function will recieve the queried string as hashkey "q" in form, as well as every other param specified here.
|
||||
It should generate a generic ajax header (see form), followed by newline separated list of possible completion values.
|
||||
%]
|
||||
<script type='text/javascript'>
|
||||
[%- FOREACH token = AUTOCOMPLETES %]
|
||||
[%- DEFAULT token.script = script %]
|
||||
[%- DEFAULT token.action = 'ajax_autocomplete' %]
|
||||
[%- DEFAULT token.INPUT_ENCODING = 'utf8' %]
|
||||
d8133a85 | Sven Schöling | [%- FOREACH key = token.params.keys %]
|
||
[%- token.additional_url = token.additional_url _ '&' _ key _ '=' _ token.params.$key %]
|
||||
[%- END %]
|
||||
6be015fa | Sven Schöling | [%- token.url = token.script
|
||
_ '?action=' _ token.action
|
||||
_ '&INPUT_ENCODING=' _ token.INPUT_ENCODING %]
|
||||
[%- SET token.url = token.url _ '&column=' _ token.column IF token.column %]
|
||||
d8133a85 | Sven Schöling | [%- SET token.url = token.url _ token.additional_url IF token.additional_url %]
|
||
6be015fa | Sven Schöling | $(document).ready( $('[% token.selector %]').autocomplete('[% token.url %]'));
|
||
[%- END %]
|
||||
</script>
|