Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.08.2010, 14:40
Интересующийся
Отправить личное сообщение для zhuzha Посмотреть профиль Найти все сообщения от zhuzha
 
Регистрация: 04.05.2010
Сообщений: 12

Заполнить список значениями из динамически созданного выпадающего списка
Есть два связанных выпадающих списка. Во втором отображаются данные в соответствии со значением выбранным в первом списке.
<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);

Но теперь все вообще не работает..

Помогите, пожалуйста..
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
ПРограмирование выпадающего списка Chyvak Общие вопросы Javascript 6 24.07.2010 09:52
высота выпадающего списка micscr (X)HTML/CSS 3 23.06.2010 18:20
Как сделать динамически загружаемый список? mikeles AJAX и COMET 9 13.11.2009 15:13
заполнить select значениями другого select Central Элементы интерфейса 1 30.05.2009 14:41