Источник изменения автозаполнения JQuery
У меня скрипка здесь
И мне нужен доступный tags1 в качестве источника, если выбрана радиокамера choice1 и доступно tags2, если выбрана опция выбора2.
И мне нужно изменить это динамически по фактическому выбору пользователя.
CODE:
var availableTags1 = [
"ActionScript",
"AppleScript",
"Asp"
];
var availableTags2 = [
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#autocomplete" ).autocomplete({
source: availableTags1
});
$('input[name="choice"]').click(function(){
if(this.checked){
if(this.value == "1"){
$( "#autocomplete" ).autocomplete('option', 'source', availableTags1)
} else {
$( "#autocomplete" ).autocomplete('option', 'source', availableTags2)
}
Ответы
Ответ 1
Try
$('input[name="choice"]').click(function(){
if(this.checked){
if(this.value == "1"){
$( "#autocomplete" ).autocomplete('option', 'source', availableTags1)
} else {
$( "#autocomplete" ).autocomplete('option', 'source', availableTags2)
}
}
})
Демо: Fiddle
Ответ 2
Для тех, кто читает это в 2016 году и за его пределами, лучше использовать шаблон request/response
. Автозаполнение jQuery имеет параметр source
, который принимает функцию, которая получит два аргумента при вызове плагина: request
и response
. request
- это объект, содержащий информацию об компоненте автозаполнения, а именно request.term
, который является значением поля ввода. response
- это функция, принимающая единственный параметр, возвращаемые данные response(data)
. как вы можете видеть в моем примере ниже, вы можете использовать эту опцию для облегчения запроса ajax. вы можете просто передать функцию request
как обратный вызов успеха методам jQuery $.ajax
, и он будет работать по назначению. вы также можете делать другие интересные вещи, используя этот шаблон, например, поиск в памяти, если вы уже загрузили и кэшировали некоторые данные, делая последующие поиски более реальным временем для пользователей.
$('#term-search').autocomplete({
source: function(request, response) {
$.ajax({
url: $('#api-endpoint').val(),//whether you are using radios, checkboxes, or selects, you can change the endpoint at runtime automatically
dataType: "json",
data: {
query : request.term,//the value of the input is here
language : $('#lang-type').val(), //you can even add extra parameters
token : $('#csrf_token').val()
},
success: response //response is a callable accepting data parameter. no reason to wrap in anonymous function.
});
},
minLength: 1,
cacheLength: 0,
select: function(event, ui) {} //do something with the selected option. refer to jquery ui autocomplete docs for more info
});