jQuery UI AutoComplete Passing input data

Question

I am sure this has been asked a ton of times, but would appreciate some assistance.

I am trying to setup the jQuery UI, which I can get a static result list with from JSON. But I need to pass my INPUT value onto the PHP script to that it can actually filter the results.

My Code for the Input Field

<input id="search" />

My Code for running my Javascript

$("#search").autocomplete({
   source: 'testData.php',
   dataType: 'json',
   minLength: 2,
   select: function(event, ui) {
            $('#contactId').val(ui.item.id);
            $('#contactName').val(ui.item.value);
   }
});

And testData.php is returning valid JSON data. But I don't know how to pass the variable from the input field to my testData.php so that it actually knows what to search for.

Hope this makes sense.

Answer 1

You don't have to do anything for this. The control automatically passes the value for you. In your php script just use this:

$_GET["term"]

They pass a querystring variable by the name of term. It's in the docs but a little obscure to find.

EDIT: I knew this because I was having the same problem last week trying to find this. Here is the URL to the docs: http://docs.jquery.com/UI/Autocomplete

Also here is the paragraph from the page that explains what to do:

When a String is used, the Autocomplete plugin expects that string to point to a URL resource that will return JSON data. It can be on the same host or on a different one (must provide JSONP). The request parameter "term" gets added to that URL. The data itself can be in the same format as the local data described above.