Unobtrusive jQuery autocomplete plugin with json key value support

2008-10-02

A simple autocomplete plugin that transparently works with a key value json array (hash).

jQuery autocomplete demo

You may ask why another jquery autocomplete plugin

Because there was no jquery autocomplete that had the following features all in one

Json
Transparent, unobtrusive key => value support
Small

As much as I hate reinventing the wheel, there was no good wheel in my case.

So here are some examples and explanations:

Examples

$("input#example").autocomplete("autocomplete.php");//using default parameters

$("input#example").autocomplete("autocomplete.php",{minChars:3,timeout:3000,validSelection:false,parameters:{'myparam':'myvalue'},before : function(input,text) {},after : function(input,text) {}});

Options

minChars = Minimum characters the input must have for the ajax request to be made
timeOut = Number of milliseconds passed after user entered text to make the ajax request
validSelection = If set to true then will invalidate (set to empty) the value field if the text is not selected (or modified) from the list of items.
parameters = Custom parameters to be passed
after, before = a function that will be caled before/after the ajax request

Download all necessary JQuery autocomplete files

Comments

Luke: Thanks a lot!! This is great and was really missing!!!

Posted on 2008-11-25 09:40:53
Neal: One apparent bug... if the drop down list fills and you click off the field (focus on field blurs) the drop down list remains (needs to go away).
Posted on 2008-12-06 07:36:55
Joe: Another possible bug, I may have found. When someone types in something not that is not in the json result, and presses [Tab] the input field is cleared.
Posted on 2008-12-30 13:28:57

Unobtrusive jQuery autocomplete plugin with json key value support

Examples

Options

Related

Comments

Make yourself heard

Categories

Unobtrusive jQuery autocomplete plugin with json key value support

Examples

Options

Share this with the world

Related

Comments

Make yourself heard

Categories

Subscribe