Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 23.01.2014, 15:56   #1
Gigabajt
 
Регистрация: 29.01.2011
Сообщений: 4
По умолчанию Скрыть незаполненные селекты

Ребя, помогите скрыть пустые выпадающие списки.
Дело в том что с самого начала задается определенное количество списков

<select size="1" id="List1" name="a1">
<option value="m1"> Автобусы </option>
</select>
<!— Подчиненный список 1 (изначально пуст) —>
<select size="1" id="List2" name="a2"></select>
<!— Подчиненный список 2 (изначально пуст) —>
<select size="1" id="List3" name="a3"></select>

Первый список заполнен, а остальные нет. Так вот, через js подчиненные списки динамически заполняются, в зависимости от того что выбрано в главном списке (a1). Но иногда, например, подчиненный "a3" остается пустым, а на странице он все-равно отображается (Скрин).
Как его скрывать, если он не заполнен?

Весь код

Цитата:

<!-- Первый (главный) список (изначально заполнен вручную) -->
<select size="1" id="List1" name="a1">
<option value="m1"> Автобусы </option>
<option value="m2"> Экскаваторы </option>
<option value="m3"> Погрузчики </option>
</select>
<br>

<!-- Подчиненный список 1 (изначально пуст) -->
<select size="1" id="List2" name="a2"></select>
<br>
<!-- Подчиненный список 2 (изначально пуст) -->
<select size="1" id="List3" name="a3"></select>
<br>
<input type= "submit" value= "Отправить">


<script type="text/javascript">
// Создаем новый объект связанных списков
var syncList1 = new syncList;

// Определяем значения подчиненных списков (2 и 3 селектов)
syncList1.dataList = {

/* Определяем элементы второго списка в зависимости
от выбранного значения в первом списке */

'm1':{
'm1_mm1':'VOLVO 8500',
'm1_mm2':'VOLVO 9700',
'm1_mm3':'VOLVO 9900',
'm1_mm4':'VOLVO B10',
'm1_mm5':'VOLVO B6',
'm1_mm6':'VOLVO B7',
'm1_mm7':'VOLVO Carrus'
},

'm2':{
'm2_mm1':'экскаваторы-погрузчики',
'm2_mm2':'мини-экскаваторы',
'm2_mm3':'колесные экскаваторы',
'm2_mm4':'гусеничные экскаваторы',
'm2_mm5':'VOLVO Carrus'
},

'm3':{
'm3_mm1':'фронтальные погрузчики',
'm3_mm2':'минипогрузчики'
},

/* Определяем элементы третьего списка в зависимости
от выбранного значения во втором списке */



'm2_mm1':{
'm2_mm1_n1':'VOLVO BL',
'm2_mm1_n2':'VOLVO BL 61',
'm2_mm1_n3':'VOLVO BL 70',
'm2_mm1_n4':'VOLVO BL 71',
'm2_mm1_n5':'VOLVO BM 6300'
},

'm3_mm1':{
'm3_mm1_n1':'версия 5'
},

'safari_mac':{
'safari_mac_1':'версия 1',
'safari_mac_2':'версия 2'
}
};

// Включаем синхронизацию связанных списков
syncList1.sync("List1","List2","Lis t3");
</script>
Gigabajt вне форума Ответить с цитированием
Старый 23.01.2014, 16:50   #2
Fenex
Форумчанин
 
Аватар для Fenex
 
Регистрация: 15.02.2012
Сообщений: 823
По умолчанию

Вот, взгляните:
http://jsfiddle.net/Fenex/F4C38/
^-.-^ My GitHub
Fenex вне форума Ответить с цитированием
Старый 23.01.2014, 18:09   #3
Gigabajt
 
Регистрация: 29.01.2011
Сообщений: 4
По умолчанию

Кажется не то.

Посмотрите
Код:
<!-- Подчиненный список 2 (изначально пуст) -->
  <select size="1" id="List3" name="a3"></select>
  <br>
  <input type= "submit" value= "Отправить"> 
  
  
<script type="text/javascript">

 //функция проверяет необходимость скрыть или показать список
    function check() {
        
if (List3.firstChild=='') {
 List3.style.display="none";
}

    }

check();
// Включаем синхронизацию связанных списков
syncList1.sync("List1","List2","List3");



</script>
Почему может не работать?
Нужно чтобы скрипт скрывал селект с ид'ом List3, который пустой, но он не скрывается

Последний раз редактировалось Gigabajt; 23.01.2014 в 18:13.
Gigabajt вне форума Ответить с цитированием
Старый 23.01.2014, 20:48   #4
Metandrostenalon
Форумчанин
 
Регистрация: 03.04.2009
Сообщений: 108
По умолчанию

Проверяй состояние через 2 список
Код:
document.getElementById('List2').addEventListener('change', function() {
  var list = document.getElementById('List3');
  if (!list.selectedIndex) {
    list.style.display = 'none';
    return;
  }
  list.style.display = 'block';
});
php,javascript
Metandrostenalon вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть строки St007 Microsoft Office Excel 7 06.04.2012 12:44
Связанные селекты Rost93 JavaScript, Ajax 1 31.03.2012 11:48
незаполненные массивы и память xrob Общие вопросы Delphi 14 03.09.2011 14:14
Взаимосвязанные селекты pavelslap PHP 2 22.05.2011 00:25