Заполнить список значениями из динамически созданного выпадающего списка
Есть два связанных выпадающих списка. Во втором отображаются данные в соответствии со значением выбранным в первом списке.
<select name="company" id="company" style="width:237px"> <option value="Inform">ЗАО «Информ»</option> <option value="Sklad">ООО «Склад»</option> </select> <select name="person" id="person" style="width:300px"> <option class="Inform" value="Abramov">Абрамов З.И. (специалист)</option> <option class="Sklad" value="Demyanov">Демьянов К.С. (специалист)</option> <option class="Inform" value="Durov">Дуров А.Л. (бухгалтер)</option> <option class="Sklad" value="Zaharova">Захарова И.Д. (бухгалтер)</option> <option class="Inform" value="Zurabov">Зурабов А.К. (генеральный директор)</option> <option class="Sklad" value="Kalinov">Калинов Т.В. (заместитель)</option> <option class="Sklad" value="Nikolaev">Николаев Б.И. (генеральный директор)</option> <option class="Sklad" value="Yaschenko">Ященко К.Д. (специалист)</option> </select> function dynamicSelect(id1, id2) { // Сперва необходимо проверить поддержку W3C DOM в браузере if (document.getElementById && document.getElementsByTagName) { // Определение переменных, ссылающихся на списки var sel1 = document.getElementById(id1); var sel2 = document.getElementById(id2); var newItem = document.createElement("LI"); // Клонирование динамического списка var clone = sel2.cloneNode(true); // Определение переменных для клонированных элементов списка var clonedOptions = clone.getElementsByTagName("option"); // Вызов функции собирающей вызываемый список refreshDynamicSelectOptions(sel1, sel2, clonedOptions); // При изменении выбранного элемента в первом списке: // вызов функции пересобирающей вызываемый список sel1.onchange = function() { refreshDynamicSelectOptions(sel1, sel2, clonedOptions); } } } // Функция для сборки динамического списка function refreshDynamicSelectOptions(sel1, sel2, clonedOptions) { // Удаление всех элементов динамического списка while (sel2.options.length) { sel2.remove(0); } var pattern1 = /( |^)(select)( |$)/; var pattern2 = new RegExp("( |^)(" + sel1.options[sel1.selectedIndex].value + ")( |$)"); // Перебор клонированных элементов списка for (var i = 0; i < clonedOptions.length; i++) { // Если название класса клонированного option эквивалентно "select" // либо эквивалентно значению option первого списка if (clonedOptions[i].className.match(pattern1) || clonedOptions[i].className.match(pattern2)) { // его нужно клонировать в динамически создаваемый список sel2.appendChild(clonedOptions[i].cloneNode(true)); newItem.appendChild(document.createTextNode(sel2.options[sel1.selectedIndex].value)); document.getElementById("myUL").appendChild(newItem); } } } Нужно на страничке создать еще один обычный (не выпадающий) список, в котором будут все значения построенные во втором динамическом списке. Обычный список: <ul id="myUL"> </ul> Для его построения добавила в скрипте в цикл пару строчек: newItem.appendChild(document.createTextNode(sel2.options[sel1.selectedIndex].value)); document.getElementById("myUL").appendChild(newItem); Но теперь все вообще не работает.. Помогите, пожалуйста.. |
Часовой пояс GMT +3, время: 18:07. |