Question

I am retriving Bing values from it’s api through this link:

http://api.bing.net/qson.aspx?Query=s&Market=en-us&JsonType=callback&JsonCallback=

Now when I parse the results on keyup and append them in the body it works but when I set the results on jQuery’s autocomplete it doesn’t.

Here is the example: http://jsfiddle.net/LkVcg/

NOTE: In the fiddle I’ve also included Yahoo’s auto suggest which uses the same method so that I can proof that it should work.

What I’m I doing wrong? How can I make the results of Bing to appear on jQuery’s autocomplete()?

Answer 1

Here is a working version of the fiddle.

There were 2 key changes:

1. I set up the URL and parameters as in your “keyup” version. That fixed the 505.
2. You were referencing “val.key” in the “success” handler instead of “val.Text” as in your “keyup” code.

Thus:

$("#bing_auto").autocomplete({
    source: function (request, response) {
        console.log("source");
        $.ajax({
            url: "http://api.bing.net/qson.aspx?Query=" + encodeURIComponent(request.term) + "&JsonType=callback&JsonCallback=?",
            dataType: "jsonp",
            /*data: {
                "Query": request.term,
                "JsonType": "callback",
                "JsonCallback" : "?"
            },*/


            success: function (data) {
                console.log("success!");
                var suggestions = [];
                $.each(data.SearchSuggestion.Section, function (i, val) {
                    console.log("suggestion: " + val.Text);
                    suggestions.push(val.Text);
                });
                response(suggestions);

            }
        });
    }
});

(Take out the “console.log()” calls if you like 🙂