Изменение input в зависимости от другого input (с использованием bootstrap typehead)
 

Приветствую.

Очередной вопрос с которым бьюсь весь день.. Итак, подключены: jQuery 10.1.1, Bootstrap 3.0.3, Bootstrap 3 Typehead (https://github.com/bassjobsen/Bootstrap-3-Typeahead).

Необходимо: при выборе страны выводить (с помощью Typeahead) только те города, которые к этой стране относятся (т.е. переключать "словарь" Typeahead). Пробовал сделать вот так...

HTML:

<input type="text" class="form-control" id="inputUserEditCountry" placeholder="Страна" value="" data-provide="typeahead" />
<input type="text" class="form-control" id="inputUserEditCity" placeholder="Город" value="" data-provide="typeahead" />

jQuery:

...
...
// Typehead inputUserEditCountry
$('#inputUserEditCountry').typeahead({
	source: ['Россия','Украина','Белоруссия']
});

// Typehead inputUserEditType
$('#inputUserEditCountry').change(function() {
	$('#inputUserEditCity').val('');
	if ($('#inputUserEditCountry').val() === 'Россия') {
		$('#inputUserEditCity').typeahead({
			source: ['Москва','Санкт-Петербург','Екатеринбург']
		});
	}
	else if ($('#inputUserEditCountry').val() === 'Украина') {
		$('#inputUserEditCity').typeahead({
			source: ['Киев','Харьков','Донецк']
		});
	}
	else if ($('#inputUserEditCountry').val() === 'Белоруссия') {
		$('#inputUserEditCity').typeahead({
			source: ['Минск','Брест','Гродно']
		});
	}
});
...
...

НО: при повторном выборе - остаётся старое значение. Иными словами, если выбрать "Россия"->"Москва", а потом выбрать "Украина", то значение городов будут соответствовать "России".

Помогите пожалуйста... :help:

Уфф.. Вопрос решился довольно просто и банально :D

Нужно было всего лишь добавить вот это:

...
...
$('#inputUserEditCountry').change(function() {
...
	$('#inputUserEditCity').typeahead('destroy');
...
...

Спасибо за внимание, может быть кому-то это тоже поможет!

Теперь столкнулся с другой проблемой: не работает выбор города в FireFox 25+ если выводить список из файла через $.getJSON(). Ошибок в консоле нет, так что даже не знаю куда копать.. В остальных броузерах (Chrome 32+, Opera 18+, IE 9+) - всё работает нормально.

Интересно, что если кликнуть мышкой на предлагаемом варианте страны (после ввода нескольких букв и/или полностью названия страны), то всё отрабатывается на ура! Т.е. ().change для этих броузеров отрабатывается только когда было совершено действие мышкой, а не с клавиатуры. Странно как-то..

Кто-нибудь сталкивался с подобной проблемой? Может быть сам алгоритм (в коде выше) не верный?..

UPD:

Запостил issue разработчику https://github.com/bassjobsen/Bootst...head/issues/19 (включая код) посмотрим, что ответит.