admin管理员组文章数量:1334826
I am trying to use the jQuery UI autoplete feature to search spotify's music library. While everything passes well, and I do get a successful response:
There is no drop down suggestions. For instance I was searching "time" and I wanted to see:
- Time by Hans Zimmer <--(This is what I was searching for)
- Back in time by Pitbull
- Elevate by Big Time Rush
etc. Here is my JavaScript code:
<script>$(function() {$( "#spotify_song_search" ).autoplete({source: function(request, response) {
$.get(".json", { q: request.term },function( data ) { alert(data); response(data);});
},success: function(data) {
// pass your data to the response callback
alert(data); response(data);
}});});</script>
I must be doing something wrong. I also checked the jQuery docs here: / but it doesn't give any explanation why this would occur. And I added alerts to see if I would at least get a response, which I do, but it just returns [object Object]
. What do I need to do to display search results?
Error: Uncaught SyntaxError: Unexpected token ILLEGAL
on Line 417:
I am trying to use the jQuery UI autoplete feature to search spotify's music library. While everything passes well, and I do get a successful response:
There is no drop down suggestions. For instance I was searching "time" and I wanted to see:
- Time by Hans Zimmer <--(This is what I was searching for)
- Back in time by Pitbull
- Elevate by Big Time Rush
etc. Here is my JavaScript code:
<script>$(function() {$( "#spotify_song_search" ).autoplete({source: function(request, response) {
$.get("http://ws.spotify./search/1/track.json", { q: request.term },function( data ) { alert(data); response(data);});
},success: function(data) {
// pass your data to the response callback
alert(data); response(data);
}});});</script>
I must be doing something wrong. I also checked the jQuery docs here: http://jqueryui./demos/autoplete/ but it doesn't give any explanation why this would occur. And I added alerts to see if I would at least get a response, which I do, but it just returns [object Object]
. What do I need to do to display search results?
Error: Uncaught SyntaxError: Unexpected token ILLEGAL
on Line 417:
- No errors in the Console tab? – Fabrício Matté Commented Jun 5, 2012 at 0:29
-
Oh never mind, the status is
OK
on your network tab. I'll look into the code. – Fabrício Matté Commented Jun 5, 2012 at 0:36 -
Maybe you can show us a little more of code, mainly your
response()
function you call 3 times, and the markup to be able to reproduce it. – Fabrício Matté Commented Jun 5, 2012 at 0:40 - Make sure it the code is actually valid first. – Incognito Commented Jun 5, 2012 at 1:26
-
1
You need to format the response data, which I assume is being done in the
response()
method. jQueryUI expects a certain format from thesuccess()
function and if it doesn't match the results will not display. I suspect the conversion from Spotify format to the expected format is not correct. Take a look at the documentation, in particular the Remote Datasource and Remote JSONP datasource and look at the Network tab in the Console to see the response data format. – andyb Commented Jun 5, 2012 at 8:48
1 Answer
Reset to default 5The autoplete widget expects data to be formatted in a very specific way so that it can be parsed. The array you supply or pass to the response
callback must be:
- An array with strings, or
- An array with objects that have a label property, a value property, or both.
(See autoplete's documentation under "Overview" / "Expected data format" for more information)
The typical way to do this when you have a data source that you can't change is use $.map
to transform the results into a format that autoplete expects:
$("#spotify_song_search").autoplete({
source: function(request, response) {
$.get("http://ws.spotify./search/1/track.json", {
q: request.term
}, function(data) {
response($.map(data.tracks, function (el) {
return el.name;
}));
});
}
});
Example: http://jsfiddle/ANmUs/ (Note: this does not appear to be working in Firefox right now; it may be due to the size of the response. It works fine in Chrome though)
本文标签: javascriptjQuery UI autocomplete drop down not displayingStack Overflow
版权声明:本文标题:javascript - jQuery UI autocomplete drop down not displaying - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742258226a2442022.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论