jQuery UI autocomplete examples

Question

I'm hoping someone can help with this, I'm having a real difficult time getting jQueryUI's autocomplete to work with ajax in a asp.net app (not MVC). I can get it to make the ajax call but I'm not doing something right handling the response.

Just for starters I'm trying to have autocomplete make an ajax call to 'GetSuggestions.aspx' which will return a hard coded string. I have it where it will make the call to GetSuggestions.aspx but I can't get it to return anything to the page. (My next step would be to have 'GetSuggestions.asxp' return a list of name/value pairs but I'll tackle that next).

I'm using the example from here: http://jqueryui.com/demos/autocomplete/#remote with the exception of using 'source: "GetSuggestions.aspx" (instead of "search.php")

Answer 1

1.write the logics in GetSuggestions.asmx(webservice) instead of GetSuggestions.aspx 2.make your method public static return_type functionname(arglist){} in GetSuggestions.asmx 3.Refer your web service in your code.

<script type="text/javascript">
$(function() {
    function log(message) {
        $("<div/>").text(message).prependTo("#log");
        $("#log").attr("scrollTop", 0);
    }

    $("#birds").autocomplete({
        source: "GetSuggestions.asmx",
        minLength: 2,
        select: function(event, ui) {
            log(ui.item ? ("Selected: " + ui.item.value + " aka " + ui.item.id) : "Nothing selected, input was " + this.value);
        }
    });
});
</script>

if your web service is resides in root directory.

or else you can use ajax control toolkit(if you like). Thanks.

Answer 2

I was looking for something similar and this example should help TextBox AutoComplete with ASP.NET and jQuery UI

Answer 3

One common problem returning XML (not sure with JSON) from Aspx page is the first Enter (NewLine) as the first character if you do not put the first line of the XML in the same than the page directives.

Wrong way:

<%@ Page Language="VB" ... %>
<?xml version="1.0"?>
<MOResponse>
    <Id_Banco>MyBank</Id_Banco>
    <Id_Status>1</Id_Status>
    <Status>Success</Status>
</MOResponse>

Right way:

<%@ Page Language="VB" ... %><?xml version="1.0"?>
<MOResponse>
    <Id_Banco>MyBank</Id_Banco>
    <Id_Status>1</Id_Status>
    <Status>Success</Status>
</MOResponse>