Как сделать выбор зависимые селекты с использованием selectize.js?

Question

[Андрей]

Собственно сабж. Скрипт с использованием selectize.js аля страна/город/улица
Может кто сталкивался?

Comments

[OVK2015]

В 3-ех разных select`ax?
В 1-ом выбрали страну,- во 2-ой добавили нужные города и т.д. В чем сложность то?

[Андрей]

OVK2015: не пойму как это сделать этим плагином ( вот такую логику https://jsfiddle.net/a6tvfh5j/

[OVK2015]

Андрей: Это тот фидл? Там и намека на selectize не наблюдается

[Андрей]

OVK2015: я же написал это только логика на обычных селектах.

[OVK2015]

Андрей: В смысле сделать выбор списка услуг из второго селекта, основываясь на специализации из 1-го?

[Андрей]

OVK2015: да

[OVK2015]

Андрей: На js-category при инициализации вешает обработчик onChange. В нем в зависимости от текущего значения заполняете js-service. Хоть через его стандартные методы, хоть через эл-ты DOM.

[Андрей]

OVK2015: в зависимости от значения? а как категорию задать в option? плагин все атрибуты чистит

[OVK2015]

Андрей:

а как категорию задать в option?

Они и так у вас заданы. Использовать value из эл-ов списка.

плагин все атрибуты чистит

Только что проверял,- сам он ничего не чистит.
Вам код полностью нужен что ли?

[Kovalsky]

Андрей: кстати, на странице selectize в последнем примере как раз ваш случай описан, мне кажется.

[Андрей]

Никита Полевой: вы видимо сами не пробовали его. там не все так тривиально.

[Андрей]

OVK2015: ну вы неужели не видите что в select от оставляет только выбранный option?

[OVK2015]

Андрей:

вы видимо сами не пробовали его. там не все так тривиально.

Обижаете,- не писал бы если б не пробовал. Хотя, да,- узнал о нем по вашему вопросу.
Там в мануале все достаточно хорошо расписано. Даже с примером.
Применительно к вашей задумке:

<select class="js-category">
		<option>Выберите специальность</option>
		<option value="1" data-age="adult">Уролог</option>
		<option value="2" data-age="adult">Гинеколог</option>
		<option value="3" data-age="child">Педиатр</option>
	</select>

	<select class="js-service">
		<option>Выберите услугу</option>
	</select>

var services =
		[
			['Уролог: Услуга 1', 'Уролог: Услуга 2', 'Уролог: Услуга 3'],
			['Гинеколог: Услуга 1', 'Гинеколог: Услуга 2'],
			['Педиатр: Услуга 1', 'Педиатр: Услуга 2', 'Педиатр: Услуга 3', 'Педиатр: Услуга 4'],
		],
		jsService;
$(document).ready(function()
		{
			$('.js-category').selectize
			({
				onChange: function(value)
				{
					jsService.disable();
					jsService.clearOptions();
        			services[value - 1].forEach(function(item, index)
        			{
        				jsService.addOption({value: index, text: item});
        				jsService.addItem(index);
        			});
        			jsService.refreshOptions();
        			jsService.setValue(0);
        			jsService.enable();
				}
			});
			var $select = $('.js-service').selectize();
			jsService = $select[0].selectize;
		});

Пойдет за ответ?