Дублируйте динамические c поля выбора, используя clone () - PullRequest
0 голосов
/ 28 января 2020

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

Я достиг дублирования div с использованием клона jQuery ( ) . Но динамически заполняющая функция не работает для первого выпадающего элемента div, а также для второго. Кроме того, иногда, когда я выбираю опцию в родительском div, это также показывает странные выборы.

var count = 1;
$('#add-new').click(function() {
  //clone
  var row = $('#scope-brand-div').clone(true);
  row.appendTo('#clone-parent');
  //add new ids
  var scopeselect = $('select.scope-select');
  var brandselect = $('select.brand-select');
  $(row).find(scopeselect).attr('id', 'project-scope' + count);
  $(row).find(brandselect).attr('id', 'brands_used' + count);
  count++;
});
<form action="add_project" method="POST">
  <h4>Project Scope&nbsp;&nbsp;<button class="clone" name="addnew" id="add-new">Add</button></h4>
  <div class="row">
    <div class="col-md-6">
      <div class="row" id="clone-parent">
        <div id="scope-brand-div">
          <div class="col-md-6">
            <div class="form-group">
              <label for="scope"><?php echo $this->lang->line('xin_project_scope');?></label>
              <select name="scope" class="form-control select-border-color border-warning scope-select" data-plugin="select_hrm" data-placeholder="<?php echo $this->lang->line('xin_project_scope');?>" id="project-scope">
                <option value=""></option>
                <?php foreach($all_project_scope as $scope) { ?>
                <option value="<?php echo $scope->scope_id; ?>">
                  <?php echo $scope->scope_name; ?>
                </option>
                <?php } ?>
              </select>
            </div>
          </div>
          <div class="col-md-6">
            <div class="form-group" id="brands-ajax">
              <label for="brands_used"><?php echo $this->lang->line('xin_brands_used');?></label>
              <select name="brands_used" id="brands_used" class="form-control select-border-color border-warning brand-select" data-plugin="select_hrm" data-placeholder="<?php echo $this->lang->line('xin_brands_used');?>">
                <option value=""></option>
              </select>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div>
    <input type="submit name=" submit " id="submit-form " value="Submit ">
</form>
...