JQuery автозаполнение с URL-адресом в качестве источника JSON
JQuery UI автозаполнение с JSON из URL
Мне не удается использовать автозаполнение JQuery с URL из http://www.omdbapi.com/ Я следовал за тем, чтобы JQuery UI автоматически заполнялся с помощью JSON из URL. Я изменил параметры, запрос к t и фразу в Title, но это не работает. Вы можете мне помочь ?
$("#tags").autocomplete({
source: function (request, response) {
$.ajax({
url: "http://www.omdbapi.com/",
data: { t: request.term },
success: function (data) {
var transformed = $.map(data, function (el) {
return {
label: el.Title,
id: el.Years
};
});
response(transformed);
},
error: function () {
response([]);
}
});
});
});
Решение
Вы пробовали Parameters в By Search с s? Из-за вас нужны названия, но t вернуть только один фильм title, Кроме того, пишите console.log (data); видеть data возвращается или нет.
обновленный
Но есть одна проблема, когда результат слишком велик, сообщение об ошибке возврата omdbapi.com, используйте параметр page
Попробуйте код ниже
<html>
<head>
<script src='https://code.jquery.com/jquery-2.2.4.js'></script>
<script src='https://code.jquery.com/ui/1.12.0/jquery-ui.js'></script>
<link href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" rel="stylesheet" media="screen" />
<script type='text/javascript'>
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#tags").autocomplete({
source: function (request, response) {
$.ajax({
method: "GET",
dataType: "json",
url: "http://www.omdbapi.com/?s="+request.term,
success: function (data) {
console.log(data);
// data.Search uses because we have `title`s in {"Search":[{..
var transformed = $.map(data.Search, function (el) {
return {
label: el.Title,
id: el.Years
};
});
response(transformed);
},
error: function () {
response([]);
}
});
}
});
});
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</body>
</html>
Другие решения
Вы не можете использовать это напрямую для заполнения списка. Эта служба OMDb возвращает ОДИН элемент за запрос.
Пробовал это Вот в jsfiddle.
$( function() {
$( "#tags" ).autocomplete({
source: availableTags
});
$( "#tags" ).autocomplete({
source: function( request, response ) {
$.ajax( {
url: "//www.omdbapi.com/",
dataType: "jsonp",
data: {
t: request.term,
type: 'movie'
},
success: function( data ) {
alert(JSON.stringify(data));
// Handle 'no match' indicated by [ "" ] response
response( data.length === 1 && data[ 0 ].length === 0 ? [] : data );
}
} );
},
minLength: 2,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.value + " aka " + ui.item.id :
"Nothing selected, input was " + this.value );
}
});
} );