Обработка select в форме

223
16 декабря 2017, 08:29

Доброго времени суток. Проблема такая, есть форма, в ней пункт "сколько детей". Он реализован через select и в нем 5 option (максимальное количество детей). Изначально value 0. Как реализовать чтобы если выбирался например value со значением 1, то рядом выползал еще один option, с выбором возраста ребенка? И в зависимости от количества детей появляется необходимое количество option с выбором их возраста. Еще как условие, optionы выбора возраста уже написаны и стилизованы, просто с display:none;, та что нужно чтобы появлялся определенный option(пусть привязка будет к классу или айдишнику). Я понимаю что это js, но не силен в нем. КТо поскажет как сделать. Вот блок того кода

fieldset.form-fieldset.ui-input.__fifth.form__border-bottom
        p.reposing__text Сколько детей?
        select#child-amount(name="reposing3").child-amount
          option(value="0") 0
          option(value="1") 1
          option(value="2") 2
          option(value="3") 3
          option(value="4") 4
          option(value="5") 5
        .child__old
          p.reposing__text-desc Их возраст
          select#child-old1(name="childOld1").child-old
            option(value="1") 1
            option(value="2") 2
            option(value="3") 3
            option(value="4") 4
            option(value="5") 5
            option(value="5") 6
            option(value="5") 7
            option(value="5") 8
            option(value="5") 9
            option(value="5") 10
            option(value="5") 11
            option(value="5") 12
            option(value="5") 13
            option(value="5") 14
            option(value="5") 15
            option(value="5") 16
            option(value="5") 17
          select#child-old2(name="childOld2").child-old
            option(value="1") 1
            option(value="2") 2
            option(value="3") 3
            option(value="4") 4
            option(value="5") 5
            option(value="5") 6
            option(value="5") 7
            option(value="5") 8
            option(value="5") 9
            option(value="5") 10
            option(value="5") 11
            option(value="5") 12
            option(value="5") 13
            option(value="5") 14
            option(value="5") 15
            option(value="5") 16
            option(value="5") 17
          select#child-old3(name="childOld3").child-old
            option(value="1") 1
            option(value="2") 2
            option(value="3") 3
            option(value="4") 4
            option(value="5") 5
            option(value="5") 6
            option(value="5") 7
            option(value="5") 8
            option(value="5") 9
            option(value="5") 10
            option(value="5") 11
            option(value="5") 12
            option(value="5") 13
            option(value="5") 14
            option(value="5") 15
            option(value="5") 16
            option(value="5") 17
          select#child-old4(name="childOld4").child-old.child-old_right
            option(value="1") 1
            option(value="2") 2
            option(value="3") 3
            option(value="4") 4
            option(value="5") 5
            option(value="5") 6
            option(value="5") 7
            option(value="5") 8
            option(value="5") 9
            option(value="5") 10
            option(value="5") 11
            option(value="5") 12
            option(value="5") 13
            option(value="5") 14
            option(value="5") 15
            option(value="5") 16
            option(value="5") 17
          select#child-old5(name="childOld5").child-old.child-old_right
            option(value="1") 1
            option(value="2") 2
            option(value="3") 3
            option(value="4") 4
            option(value="5") 5
            option(value="5") 6
            option(value="5") 7
            option(value="5") 8
            option(value="5") 9
            option(value="5") 10
            option(value="5") 11
            option(value="5") 12
            option(value="5") 13
            option(value="5") 14
            option(value="5") 15
            option(value="5") 16
            option(value="5") 17
READ ALSO
Как пробежаться по всем нужным key в Firebase Database?

Как пробежаться по всем нужным key в Firebase Database?

Есть список городов - далее messages (все сообщения) и далее список пользователей этого города users

223
Как ограничить ширину canvas, fengyuanchen/cropper canvas size

Как ограничить ширину canvas, fengyuanchen/cropper canvas size

У меня открывается фотография в модальном окне, она открывается как canvasПроблема в том что Рамочка для вырезания может выходить за пределы...

205