jquery autocomplete not populating unless entered text is in the first result

Im having an issue with jquery autocomplete plugin. the textbox im using wont populate the results of autocomplete until i enter a value that is in the first entry of my data. After it populates that, then the autocomplete works how its supposed to.

$(document).ready(function () {

});

function textChange() {

var callback = function (request, response) {
    var searchText = request.item;
    var searchField = $(".ddlist > option:selected").attr("value");
    $.ajax({
        type: "GET",
        dataType: "text",
        url: "SearchCallback.aspx?searchText=" + searchText + "&searchField=" + searchField,
        success: function (data) {
            var splitData = data.split(",");
            response(splitData);
        }
    });
}
$(".searchTextBox").autocomplete({
    source: callback,
    autoFill: true
})    
}

after playing around with it 开发者_开发百科i got the following code to work, before i was using an onkeyup event in the text box but i guess i didnt need it. i dont know if this is efficient but it is working correctly now.

$(document).ready(function () {
$(".searchTextBox").autocomplete({
    source: callback,
    autoFill: true
});
});

var callback = function (request, response) {
var searchText = request.term;
var searchField = $(".ddlist > option:selected").attr("value");
$.ajax({
    type: "GET",
    dataType: "text",
    url: "SearchCallback.aspx?searchText=" + searchText + "&searchField=" + searchField,
    success: function (data) {
        var splitData = data.split(",");
        response(splitData);
    }
});
}

You have to use a callback as the source option when you initialize the autocomplete (in your example you initialize the autocomplete every time a key is being pressed):

var callback = function(request, response) {
    var searchText = request.item;
    // Set searchField somehow here
    $.ajax({  
         type: "GET",  
         dataType: "text",  
         url: "SearchCallback.aspx?searchText=" + searchText + "&searchField=" + searchField,
         success: function (data)
        {
            var splitData =  data.split(",");
            response(splitData);
        });      
    });
};

$( ".searchTextBox" ).autocomplete({
    source: callback,
    autoFill: true
});

There are some more examples and a more detailed description in the documentation.