добавляйте и удаляйте div, используя jquery, когда выбираете n опций - PullRequest
0 голосов
/ 28 сентября 2019

Я хочу добавить n количество групп полей ввода, когда выбрано n опций в поле выбора.я могу успешно добавить, используя jquery в div, но когда я уменьшаю n чисел в поле выбора, он стирает все данные, заполненные в других группах полей.

В общем, что мне нужно, когда я выбираю 5, затем 5 раз, он должен добавить группу полей, и после этого, когда мы выбираем 4, последний добавленный div должен быть удален, и если есть данные, заполненные другими div, он должен остатьсятам.

как это сделать

<select name="adults" id="adults" class="shadow">
 <option value="1">1 adult</option>
  <option value="2">2 adults</option>
 <option value="3">3 adults</option>
  <option value="4">4 adults</option>
 <option value="5">5 adults</option>
 </select>

<div id="content"></div>

<script>
        var content = $("#content");
        $("#adults").change(function() {
            newContent = "";
            for (var i = 2; i <= noofadult; i++) {
                newContent += '<div class="o-accent-box u-clearfix u-margin-bottom-medium passenger-detail"><h3 class="h5-like o-heading-icon icon-passenger">Passenger ' + i + ' (Adult)<span class="field-required">*</span></h3><div class="o-form-item form-item-title"><label for="title-select-{index}" class="u-visually-hidden">Title</label><select id="title-select-{index}" name="visitor[' + i + '][title]" required="" class="o-form-item__txt-input"><option value="">Title</option><option value="Mr">Mr</option><option value="Mrs">Mrs</option><option value="Ms">Ms</option><option value="Miss">Miss</option><option value="Dr">Dr</option></select></div><div class="o-form-item form-item-first-name"><label for="pax-first-name-0" class="u-visually-hidden">First Name</label><input id="pax-first-name-0" type="text" placeholder="First name(s)" name="visitor[' + i + '][firstName]" class="o-form-item__txt-input"></div><div class="o-form-item form-item-surname"><label for="pax-surname-0" class="u-visually-hidden">Surname(s)</label><input id="pax-surname-0" type="text" placeholder="Surname(s)" name="visitor[' + i + '][lastName]" class="o-form-item__txt-input"></div></div>';


            }

            content.html(newContent);

        }).trigger('change');;

    </script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...