У меня проблема в jQuery, где я должен добавить несколько выпадающих списков, используя select 2.

des: У меня проблема в jQuery, где я должен добавить несколько выпадающих списков, используя select 2, когда я добавляю проект динамически, проект добавляется только в первый выпадающий список

html

<select class="js-example-basic-multiple drops" id="dropdown-1" style="width: 110px;" name="projects[]" multiple="multiple">
  <option value="add">Add Project</option>
</select>
<div data-ml-modal id="modal-11" class="modal-11">
  <a href="#!" class="modal-overlay"></a>
  <div class="modal-dialog modal-dialog-lg">
    <a href="#!" class="modal-close">&times;</a>
    <h3>Create New Project</h3>
    <div class="modal-content">
      <input type="text" name="projectName" placeholder="Add Project Name" class="proname">
      <button type="button" onclick="submitData(event)" id="addProject">Add</button>
    </div>
  </div>
</div>

Код jQuery:

function submitData(e) {
  let projectName = $('input[name="projectName"]')
  console.log(projectName.val())
  $.ajax({
    url: '{% url "update" %}',
    type: 'POST',
    data: {
      'pname': projectName.val(),
    },
    success: (data) => {
      console.log(data)
      console.log(typeof data)
      if (data) {
        Object.values(data).forEach(item => {
          document.querySelectorAll('.drops').forEach(select => {
            $(select).find('option').not(':last').remove();
            $(select).append($('<option></option>').attr('value', item.project).text(item.project))
            console.log(select)
          })
        })
      }
    },
    error: (error) => {
      alert("Something went wrong")
    },
  })
}

Вернуться на верх