jQuery Autocomplete

Q: What is Autocomplete?
A:The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript);


jQuery-prototype-autocomplete

 1) Autocomplete in cakephp (prototype) 
  In ajax autocomplete to add more than one value
You can use "tokens" like below

 <?php new Ajax.Autocompleter('id','upd', 'url', { tokens: ',' }); ?>

 http://wiki.github.com/madrobby/scriptaculous/ajax-autocompleter



Autocomplete, when added to an input field, enables users to quickly find and select from a pre-populated list of values as they type, leveraging searching and filtering.

By giving an Autocomplete field focus or entering something into it, the plugin starts searching for entries that match and displays a list of values to choose from. By entering more characters, the user can filter down the list to better matches.

This can be used to enter previous selected values, for example you could use Autocomplete for entering tags, to complete an address, you could enter a city name and get the zip code, or maybe enter email addresses from an address book.

You can pull data in from a local and/or a remote source: Local is good for small data sets (like an address book with 50 entries), remote is necessary for big data sets, like a database with hundreds or millions of entries to select from.


 2)
jQuery autocomplete 

<script language="JavaScript">
jQuery(document).ready(function()  {
  jQuery("#FriendMyLocation").autocomplete('/autocompletes/index/City/name', {minChars:3}); 
});         

$.Autocompleter.defaults = {
    inputClass: "ac_input", 
    resultsClass: "ac_results", 
    loadingClass: "ac_loading",
    minChars: 1, 
    delay: 400, 
    matchCase: false,
    matchSubset: true,
    matchContains: false,
    cacheLength: 10,
    max: 100, 
    mustMatch: false,
    extraParams: {},
    selectFirst: true, 
    formatItem: function(row) { return row[0]; },
    autoFill: false, 
    width: 0, 
    multiple: false, 
    multipleSeparator: ", ",
    highlight: function(value, term) { 
        return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([^$()[]{}*.+?|\])/gi, "\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>"); 
    }, 
    scroll: true, 
    scrollHeight: 180, 
    attachTo: 'body' 
};
</script>  

http://docs.jquery.com/Plugins/autocomplete