Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery: Yahoo Autocomplete/Autosuggest

I'm trying to retrieve yahoo autocomplete.

Yahoo's JSON url is this: http://ff.search.yahoo.com/gossip?output=fxjson&command=query

So I have:

   $("selector").autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: "http://ff.search.yahoo.com/gossip",
                dataType: "jsonp",
                data: {
                    "output" : "fxjson",
                    "command" : request.term
                },
                success: function( data ) {
                    response(data[1])
                }
            })
        }
    });

And here is an example: http://jsfiddle.net/yQbdb/

Can someone spot a mistake or what I'm I doing wrong? It should work.

Thanks

like image 850
jQuerybeast Avatar asked Nov 13 '22 13:11

jQuerybeast


1 Answers

Setting output to jsonp works for me.

See example query for the structure of the output.

The explanation is below.

Code is HERE.

$("#wd6450").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "http://ff.search.yahoo.com/gossip",
            dataType: "jsonp",
            data: {
                "output": "jsonp",
                "command": request.term
            },
            success: function(data) {
                var suggestions = [];
                // for each element in the data.gossip.results array ...
                $.each(data.gossip.results, function(i, val) {
                    // .. push the value of the key inside our array
                    suggestions.push(val.key);
                });
                // call response with our collected values
                response(suggestions);

            }
        });
    }
});

Explanation:

By using dataType: "jsonp" jQuery expects the output format to be in JSONP. When you make a call from your code using output: "fxjson" the URL looks like this but as you can see the output is not a valid JSONP, because the callback was not called.

On the other hand when you specify output: "jsonp" the query looks like this and as you can see the output is a valid JSONP - the callback was called.

You linked a Amazon example in the comments. $.ajax() call there will try to URL like this. Output from Amazon's webservice is valid JSONP, because callback is called with all the data.

So the result is: Yahoo webservices will return format in JSONP if you provide ?output=jsonp parameter in the URL by configuring $.ajax() with output: "jsonp". Amazon's webservice returns this format by default without any extra parameters. This is webservice specific configuration and must be consulted with its documentation or other related resourcers.

Information about JSONP available HERE.

like image 52
kubetz Avatar answered Nov 16 '22 02:11

kubetz