Question

I’m trying to return the track “href” value from the spotify api using the jQuery autocomplete widget. Here is my code:

    $(function() {
    $("#spotify_song_search").autocomplete({
        source: function(request, response) {
            $.get("http://ws.spotify.com/search/1/track.json", {
                q: request.term
            }, function(data) {
                response($.map(data.tracks, function(el, ui) {
                    return el.name;
                }));
            });
        },
        select: function(el, ui) {
            alert(ui.item.href);
        }
    });
});​

URL to response: http://ws.spotify.com/search/1/track.json?q=time

In it’s current state it alerts [object Object]. What do I need to do to return the href value?

Answer 1

How about this: http://jsfiddle.net/MMPTC/

   $(function() {
    $("#spotify_song_search").autocomplete({
        source: function(request, response) {
            $.get("http://ws.spotify.com/search/1/track.json", {
                q: request.term
            }, function(data) {
                response($.map(data.tracks, function(item) {
                    return {label: item.name, track: item};
                }));
            });
        },
        select: function(el, ui) {
                console.log(ui);
            $("#track").attr("href",ui.item.track.href).text("Listen");
        }
    });
});​

<input type="text" id="spotify_song_search">
<a id='track'></a>​

P.S. The fact that this amount of code actually lets me search for tracks and actually play them, just blew my mind. The internet is…AWESOME. 🙂