Есть такая формочка заказ билетов, где нужно указать откуда летишь и куда:
$('.js-autocomplete').on('focus', function(){
window.autocomplite_items = false
$(this).autocomplete({
source:'https://ufsa.com.ua/ufsa/autocomplete.php',
minLength: 2,
autoFocus : true,
select: function( event, ui ) {
console.log('select');
window.autocomplite_items = true
$(this).next().val(ui.item.id);
},
close: function(event, ui) {
if(!window.autocomplite_items && this.value.length >= 2) {
var alias = this
$.get('https://ufsa.com.ua/ufsa/autocomplete.php?b&term=' + this.value , {} , function(tpl) {
try {
var obj = eval('(' + tpl + ')');
$(alias).next().val(obj[0].id)
} catch(e) {
console.debug(e)
}
})
}
}
});
});
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<br>
<br>
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input type="text" name="from" id="from" class="form-control js-autocomplete" placeholder="Откуда">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="text" name="to" id="to" class="form-control js-autocomplete" placeholder="Куда">
</div>
</div>
</div>
</div>
Использую jquery ui autocomplete и json файл с др. сайта.
Задача, при фокусе на поле должны высвечиваться варианты аэропортов - город + код аэропорта (например как тут - *не реклама, исключительно как пример).
Вопрос: Как реализовать автокомплит городов с аэропортами, возможно, есть международными и общедоступный jsonp файл с подобными данными? Что для php нужно?
И как реализовать несовпадение откуда и куда (при вводе города откуда, чтобы в куда уже он не высвечивался)?
P.S: И если в дальнейшем планируется интеграция в Wordpress, возможно, есть готовые плагины\виджеты для реализации подобного?