Question

I’m hoping someone can help with this,
I’m having a really difficult time getting jQueryUI’s autocomplete to work with $.ajax({}) call in an asp.net application.
I can get it to make the ajax call, am getting response from service and the list of the locations.
but still the autocomplete list is not shown, when I press the down arrow key then location list is rendered on the page.
It should be rendered/shown immediately after getting the list of locations from web method. How could it be possible?

I’m using autocomplete from jquery site: http://jqueryui.com/demos/autocomplete/

Sample Code

function GetCitiesLikeList(objcity) {    
var cities = "";
        $.ajax({
            type: "POST",
            url: http://localhost/testweb/location.asmx/Getlocations,
            data: "{ City : '" + objcity + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != null && msg.d != "") {
                    cities = "";
                    cities = msg.d;
                    $("#citilist").autocomplete({
                        source: cities
                    });
                }
                else
                    $("#citilist").attr("autocomplete", "off")
            },
            error: function (xhr, ajaxOptions, thrownError) { return false; }
        }); 
}

Answer 1

I found another way to trigger the jQuery UI autocomplete functionality, without typing into the box:

$('#field').autocomplete({
    source: '/path/to/data',
    minLength: 0
});
$('#button').click(function() {
    $('#field').autocomplete('search', '')
});

Sending the ‘search’ arg triggers the search functionality. The second argument is the “term” sent to the data handler at /path/to/data.