jQuery AutoComplete (jQuery UI 1.8rc3) with ASP.NET web service

Question

Currently, I have this version of the autocomplete control working when returning XML from a .ashx handler. The xml looks like this: ``` CA California NC North Carolina SC South Carolina ``` The autocomplete code looks like this: ``` $('.autocompleteTest').autocomplete( { source: function(request, response) { var list = []; $.ajax({ url: "http://commonservices.qa.kirkland.com/StateLookup.ashx", dataType: "xml", async: false, data: request, success: function(xmlResponse) { list = $("State", xmlResponse).map(function() { return { value: $("Code", this).text(), label: $("Name", this).text() }; }).get(); } }); response(list); }, focus: function(event, ui) { $('.autocompleteTest').val(ui.item.label); return false; }, select: function(event, ui) { $('.autocompleteTest').val(ui.item.label); $('.autoco…

Accepted Answer

I got the autocomplete to work with .asmx by using JSON. Here is an example of what I did:

JavaScript:

```
$("#tbNameFilter").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "/Services/AutocompleteService.asmx/Aoi_Autocomplete",
            data: "{ 'q': '" + request.term + "', 'limit': '10' }",
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataFilter: function (data) { return data; },
            success: function (data) {
                response($.map(data.d, function (item) {
                    return {
                        label: item.Name,
                        value: item.Name
                    }
                }))
            }
        });
    },
    minLength: 1
});
```

Web Service:

```
[WebMethod]
public List<FAD_Aoi> Aoi_Autocomplete(String q, int limit)
```

jQuery AutoComplete (jQuery UI 1.8rc3) with ASP.NET web service

Solution

Problem