passing additional variable jqueryui autocomplete

I found a nice article about jqueryui auto complete from here. It's shows how to fetch data from mysql using json. It's working perfectly. But I have to send a variable value like below.

Index.php

<form>
<select name="typeo" id="typeo" class="select" title="Select Country from List">
    <option>None</option>
    <option>US</option>
<option>UK</option>
</select>

<input type="text" id="state"  name="state" /> <input readonly="readonly" type="text" id="abbrev" name="abbrev" maxlength="2" size="2"/></p>
    <input type="submit" name="submit" value="Submit" /></p>

And the jquery is

$('#abbrev').val("");

        $("#开发者_如何学编程state").autocomplete({
            source: "states.php",
            minLength: 2,
            select: function(event, ui) {
                $('#state_id').val(ui.item.id);
                $('#abbrev').val(ui.item.abbrev);
            }
        });
    });

now I want to send the value of typeo in states.php so the mysql query could be like

"SELECT statename, statecode FROM states where country='$typeoValue' AND statename LIKE '%$states%'"

So how can I send the value of typeo? Can any one help me please. Thanks.

You'll have to use a callback argument for source.

Something like this should work (untested).

$('#abbrev').val("");

        $("#state").autocomplete({
            source: function(term, callback) {
                callback($.getJSON('states.php', {states: term, typeo: $("#typeo").val()}));
            },
            minLength: 2,
            select: function(event, ui) {
                $('#state_id').val(ui.item.id);
                $('#abbrev').val(ui.item.abbrev);
            }
        });
    });

More info about this is on http://jqueryui.com/demos/autocomplete/

The third variation, the callback, provides the most flexibility, and can be used to connect any data source to Autocomplete. The callback gets two arguments:

A request object, with a single property called "term", which refers to the value currently in the text input. For example, when the user entered "new yo" in a city field, the Autocomplete term will equal "new yo".

A response callback, which expects a single argument to contain the data to suggest to the user. This data should be filtered based on the provided term, and can be in any of the formats described above for simple local data (String-Array or Object-Array with label/value/both properties). It's important when providing a custom source callback to handle errors during the request. You must always call the response callback even if you encounter an error. This ensures that the widget always has the correct state.