Форум

dpts · #1 (**permalink**) 15.02.2016, 09:49

Приветствую, есть примерно вот такая разметка

<!DOCTYPE HTML>

<html>

<head>

  <title>Селекты</title>
</head>

<body>
<!-- Главный Селект -->
<select Name="fio">
    <option Value="1">Иванов</option>
    <option Value="2">Петров</option>
    <option Value="3">Сидоров</option>
    ...
    <option Value="n">Нурсульфазолов</option>
</select>


<!-- Селект от Иванова -->
<select Name="Child">
    <option value="1">Сын Иван</option>
    <option value="2">Дочь Маша</option>
    ...
    <option value="n">Сын Петр</option>
</select>

<!-- Селект от Петрова -->
<select Name="Child">
    <option value="1">Сын Василий</option>
    <option value="2">Сын Николай</option>
    ...
    <option value="n">Дочь Катерина</option>
</select>

<!-- Селект от Сидорова -->
<select Name="Child">
    <option value="1">Сын Владимир</option>
    <option value="2">Дочь Ольга</option>
    ...
    <option value="n">Сын Михаил</option>
</select>

...

<!-- Селект от Нурсульфазолова -->
<select Name="Child">
    <option value="1">Сын Сергей</option>
    <option value="2">Сын Кирилл</option>
    ...
    <option value="n">Сын Алексей</option>
</select>

</body>

</html>

Селекты и их содержимое создаются VBS-ом циклами из БД
Необходимо Показывать Главный селект всегда, а из остальных - только один, тот который от того товарища, который сейчас выбран в главном селекте.
То-есть, если в Главном селекте выбран Сидоров, то показывать селект с детьми Сидорова.

В идеале, конечно, лучше по Главному селекту выполнять серверный скрипт, чтобы он отдавал один единственный нужный селект.

Dilettante_Pro · #2 (**permalink**) 15.02.2016, 10:17

dpts,
Интересно, а по какому признаку у вас определяется, где чей select?
Как определить, который select - с детьми Сидорова? По комментарию?

dpts · #3 (**permalink**) 15.02.2016, 10:21

Сообщение от Dilettante_Pro

dpts,
Интересно, а по какому признаку у вас определяется, где чей select?
Как определить, который select - с детьми Сидорова? По комментарию?

Ну так и мне тоже интересно.

рони · #4 (**permalink**) 15.02.2016, 10:38

dpts,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .hide{
    display: none;
  }

  </style>
</head>

<body>
<!DOCTYPE HTML>

<html>

<head>

  <title>Селекты</title>
</head>

<body>
<!-- Главный Селект -->
<select name="fio">
    <option value="1">Иванов</option>
    <option value="2">Петров</option>
    <option value="3">Сидоров</option>
    ...
    <option value="n">Нурсульфазолов</option>
</select>


<!-- Селект от Иванова -->
<select name="Child">
    <option value="1">Сын Иван</option>
    <option value="2">Дочь Маша</option>
    ...
    <option value="n">Сын Петр</option>
</select>

<!-- Селект от Петрова -->
<select name="Child">
    <option value="1">Сын Василий</option>
    <option value="2">Сын Николай</option>
    ...
    <option value="n">Дочь Катерина</option>
</select>

<!-- Селект от Сидорова -->
<select name="Child">
    <option value="1">Сын Владимир</option>
    <option value="2">Дочь Ольга</option>
    ...
    <option value="n">Сын Михаил</option>
</select>

...

<!-- Селект от Нурсульфазолова -->
<select name="Child">
    <option value="1">Сын Сергей</option>
    <option value="2">Сын Кирилл</option>
    ...
    <option value="n">Сын Алексей</option>
</select>
<script>
window.addEventListener('DOMContentLoaded', function() {
    var fio = document.querySelector('[name="fio"]'),
        child = document.querySelectorAll('[name="Child"]');

    function change() {
        val = this.value - 1;
        [].forEach.call(child, function(sel, i) {
            sel.classList[val == i ? "remove" : "add"]("hide")
        });

    }
    fio.addEventListener('change', change);
    change.call(fio)()
});
</script>
</body>

</html>

</body>

</html>

dpts · #5 (**permalink**) 15.02.2016, 10:55

Благодарю.

Dilettante_Pro · #6 (**permalink**) 15.02.2016, 11:00

рони,
По порядку? VBS гарантирует? А если нет детей у кого-то - будет пустой селект?

рони · #7 (**permalink**) 15.02.2016, 11:26

Сообщение от Dilettante_Pro

По порядку? VBS гарантирует?

похоже он даже синтаксис не гарантирует

ответ дан по исходным данным, с исправлением toLowerCase

laimas · #8 (**permalink**) 15.02.2016, 11:36

Сообщение от dpts

Необходимо Показывать Главный селект всегда, а из остальных - только один

Изначально на странице должен быть вообще один родительский список, а его дочерние запрашивать асинхронно.

Форум

Справочник

Discord чат

Курсы javascript