Плагин Autocomplete используется для быстрой подсказки пользователю вариантов ввода из определенного списка. Но в случае зависимости эти вариантов от других полей — обновление данных очень неочевидно. В этой статье — пример решения задачи.
Самый простой пример — это зависимость условных моделей авто от марки. Когда пользователь выбрал Марку «Mercedes» — в поле модель ему должны быть доступны модели именно этой марки. Когда выбрал «BMW» — соответственно — модели BMW.
Вариант ajax-подгрузки не рассматриваем в рамках статьи — т.к. он делает ну слишком много ненужных обращений к серверу. А ведь список формируется уже в момент выбора Марки и не изменяется, пока не изменится там самая марка.
На самом деле ответ занимает всего одну строку:
$('#target').autocomplete('option', { 'source': modelsList });
Если говорить коротко — то этот код обновляет список подсказок на целевом поле и делает его равным значению modelsList.
Как получить этот список — зависит от Вашей реализации — например, после изменения значения, от которого зависит список можно делать ajax-обращение на сервер и получать данные. К примеру:
$('#general').on('blur', function(e){
e.preventDefault();
var th = $(this) ; // создаем контекст на себя, т.к. $(this) внутри $.post будет иметь другое значение
$.post(
'/get-data',
{'value' : th.val() }, // отправляем текущее значение
function( response ){ // в ответе ждем JSON
$('#target').autocomplete('option', { 'source': modelsList }) ; // сразу подставляем ответный JSON в целевое поле
}
);
return false;
});
Не вдаваясь в глубины и различные варианты проблемы — это типичный пример решения задачи.
Надеюсь статья была Вам полезной. Удачи!