当用户插入正确的值并转义输入字段时,我想自动填充输入字段。一个例子是https://www.redbus.in/ 我使用url字符串发送数据请求,然后收到结果。我想继续发送数据请求并接收结果,即使用户逃离现场?然后必须选择包含结果的列表的第一个值。而不是你的帮助!
我的代码是:
jQuery(document).ready(function(){
jQuery( "#econt_offices_town" ).autocomplete({
minLength: 2,
autoFocus: true,
source: function( request, response ) {
jQuery.ajax({
url: ajaxurl,
dataType: "json",
data: {
action:'handle_ajax',
city: request.term
},
success: function( data ) {
response(jQuery.map(data, function(item) {
return {
label: item.label,
value: item.value,
city_id: item.id,
post_code: item.post_code
};
}));
}, //end of success
}); //end of ajax
}, //end of source
select: function( event, ui ) {
var city_id = ui.item.city_id;
var post_code = ui.item.post_code;
jQuery('#econt_offices_postcode').val(post_code);
jQuery('#office_locator').show(); //show office locator button after the city is selected
jQuery('#econt_offices_postcode, label[for="econt_offices_postcode"], #econt_offices, label[for="econt_offices"]').show();
jQuery.ajax({
url: ajaxurl,
dataType: "json",
data: {
action:'handle_ajax',
office_city_id: city_id,
delivery_type: 'to_office'
},
success: function( data ) {
jQuery('#econt_offices').empty()
jQuery.each(data, function(key, value) {
jQuery('#econt_offices').append(jQuery("<option/>", {
value: value.id,
text: value.value + ' [о.к.:' + value.id + ']'
}));
});
calculate_loading(); //calculate loading cost for shipping to office
} //end of success
}); //end of ajax
}, //end of select
}); //end of #econt_offices_town .autocomplete
答案 0 :(得分:0)
尝试添加一些额外的事件管理,但需要一些创造性的用途。
如果我理解你想在某人选中时选择一个值或点击其他地方(焦点丢失)
$("#econt_offices_town").on('keydown focusout', function(event) {
if (event.keyCode != $.ui.keyCode.TAB && !(event.type == "focusout")) return;
event.keyCode = $.ui.keyCode.DOWN;
event.type = "keydown";//change the event from focusout
$(this).trigger(event);
event.keyCode = $.ui.keyCode.ENTER;
$(this).trigger(event);
});
答案 1 :(得分:0)
我明白了。这是如何自动选择列表中只有一个值。我把这段代码放在&#34; source&#34;和&#34;选择&#34;
response: function(event,ui) {
if (ui.content.length == 1) {
ui.item = ui.content[0];
jQuery( "#econt_offices_town" ).data('ui-autocomplete')._trigger('select', 'autocompleteselect', ui);
jQuery( "#econt_offices_town" ).autocomplete('close');
}
},