Как реализовать динамическую таксономическую навигацию / иерархический выпадающий список с использованием ajax / jQuery?

Question

Я хотел бы предоставить своим пользователям способ навигации по таксономии, последовательно развернув раскрывающиеся списки ono.

Простым примером будет что-то вроде категории ebay. Допустим, вы выбрали категорию «Одежда», в следующем выпадающем списке будут отображены все подкатегории в разделе «Одежда», такие как «Шорты», «Брюки», «Пальто» и т. Д. И это может произойти сколь угодно глубоко.

Я посмотрел на плагин jQuery mcDropdown. Интерфейс выглядит действительно красиво. Однако, кажется, требуется, чтобы вся таксономия была передана плагину за один раз. Другие плагины, на которые я смотрел, также имеют это ограничение.

Мне нужно что-то, что извлекает и отображает данные динамически. Поэтому после того, как пользователь выберет «Одежда», пользовательский интерфейс отправляет этот выбор обратно на сервер, который затем отправляет обратно список подкатегорий «Одежда» и т. Д. И т. Д.

Есть ли плагин jQuery, который это делает? Или что потребуется для реализации этого в простой jQuery?

Я бы предпочел jQuery, но другие фреймворки тоже подойдут.

Answer 1

Я не знаю какого-либо плагина для этого, поэтому здесь разбивка процесса ..

Внедрение не должно занять много времени .. ( Я не пытаюсь сделать это, так как это зависит от вашей серверной технологии и предпочтение между html / xml / json для вызова ajax возвращает. * jquery Ajax-вызов для получения данных 1-го уровня создать выпадающий список с помощью jquery и добавить к нему извлеченные данные Элемент списка используйте метод jquery .data() в новом раскрывающемся списке счетчика автоинкремента (будет использоваться для удаления всех более поздних экземпляров при изменении чего-либо в раскрывающемся списке, который не является последним) привязывает обработчик к событию .change() нового раскрывающегося списка, который будет повторять весь процесс, передавая в качестве параметра ajax вызов идентификатора выбора (должен создать логику один раз и просто вызвать ее вручную в первый раз. .) в том же обработчике, проверьте, не является ли счетчик поля выбора последним, найдите все выпадающие списки и удалите те, чей счетчик больше этого значения. добавить новый выпадающий список в DOM .. Надеюсь, в этом есть какой-то смысл ..

Answer 2

Я однажды написал плагин , который может быть тем, что вы ищете; если нет, то, по крайней мере, это должно дать вам хорошее место для начала кодирования (надеюсь:)