Как пройти дополнительный параметр в поле jQuery AutoComplete?
-
02-10-2019 - |
Вопрос
Я использую автозаполнение jQuery в одной из моих форм.
Основная форма выбирает продукты из моей базы данных. Это отлично работает, но я хотел бы в дальнейшем развиваться, чтобы вернулись только товары, отправленные из определенного почтового инвента. Я получил скрипт Backend. Мне просто нужно выработать лучший способ передать почтовый индекс к этому сценарию.
Вот как моя форма выглядит.
<form>
<select id="zipcode">
<option value="2000">2000</option>
<option value="3000">3000</option>
<option value="4000">4000</option>
</select>
<input type="text" id="product"/>
<input type="submit"/>
</form>
А вот код jQuery:
$("#product").autocomplete
({
source:"product_auto_complete.php?postcode=" + $('#zipcode').val() +"&",
minLength: 2,
select: function(event, ui){
//action
}
});
Этот код работает до такой степени. Но возвращает только первое значение zipcode независимо от того, какое значение на самом деле выбрано. Я предполагаю, что происходит, что у URL-адрес источника настраивается на странице нагрузки, а не когда меню выбора изменяется. Есть ли способ обойти это? Или есть лучший способ в целом для достижения результата я после?
Решение
Вам нужно использовать другой подход для source
Позвоните, как это:
$("#product").autocomplete({
source: function(request, response) {
$.getJSON("product_auto_complete.php", { postcode: $('#zipcode').val() },
response);
},
minLength: 2,
select: function(event, ui){
//action
}
});
Этот формат позволяет передавать все, что значение когда это работает, в отличие от когда это связано.
Другие советы
Это не сложные мужчины:
$(document).ready(function() {
src = 'http://domain.com/index.php';
// Load the cities straight from the server, passing the country as an extra param
$("#city_id").autocomplete({
source: function(request, response) {
$.ajax({
url: src,
dataType: "json",
data: {
term : request.term,
country_id : $("#country_id").val()
},
success: function(data) {
response(data);
}
});
},
min_length: 3,
delay: 300
});
});
Я верю, что вы правильно думаете, что ваш звонок $("#product").autocomplete
стреляет на страницу нагрузки. Возможно, вы можете назначить обработчик OnChange () в меню «Выбрать»:
$("#zipcode").change(resetAutocomplete);
и иметь ли это недействительным #product
Автозаполнение () Вызов и создайте новый.
function resetAutocomplete() {
$("#product").autocomplete("destroy");
$("#product").autocomplete({
source:"product_auto_complete.php?postcode=" + $('#zipcode').val(),
minLength: 2,
select: function(event, ui){... }
});
}
Вы можете захотеть, чтобы ваш RESETAUTOCOLPOPLETE () должен быть немного умным - как проверка, если Zip-код на самом деле отличается от последнего значения - для сохранения нескольких серверных вызовов.
jQuery("#whatJob").autocomplete(ajaxURL,{
width: 260,
matchContains: true,
selectFirst: false,
minChars: 2,
extraParams: { //to pass extra parameter in ajax file.
"auto_dealer": "yes",
},
});
Эта работа для меня. Переопределить событие search
:
jQuery('#Distribuidor_provincia_nombre').autocomplete({
'minLength':0,
'search':function(event,ui){
var newUrl="/conf/general/provincias?pais="+$("#Distribuidor_pais_id").val();
$(this).autocomplete("option","source",newUrl)
},
'source':[]
});
$('#product').setOptions({
extraParams: {
extra_parameter_name_to_send: function(){
return $("#source_of_extra_parameter_name").val();
}
}
})
$('#txtCropname').autocomplete('Handler/CropSearch.ashx', {
extraParams: {
test: 'new'
}
});
Надеюсь, что это поможет кому-то:
$("#txt_venuename").autocomplete({
source: function(request, response) {
$.getJSON('<?php echo base_url(); ?>admin/venue/venues_autocomplete',
{
user_id: <?php echo $user_param_id; ?>,
term: request.term
},
response);
},
minLength: 3,
select: function (a, b) {
var selected_venue_id = b.item.v_id;
var selected_venue_name = b.item.label;
$("#h_venueid").val(selected_venue_id);
console.log(selected_venue_id);
}
});
«Термин по умолчанию» будет заменен новым списком параметров, поэтому вам потребуется добавить снова.