在动态模态输入上选择 2

Question

我正在显示多个动态模态以更新一些数据。

<div class="modal fade experience-details exp_update" id="editExperienceModal_{{$exp->id}}" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

我的模态的 id 是这样的 editExperienceModal_1,editExperienceModal_2,等等..

这是 select2 输入

<select class="form-control sub-select2" name="clinic_name" id="select2_clinic_update_{{$exp->id}}" style="width:100%"></select>

如果它不是动态内容，我可以像这样调用 select2 和 dropdownParent

$("#select2_clinic_update").select2({
  placeholder: 'Select clinic name',
  dropdownParent: $('#editExperienceModal_'),
  ......
  ......

如何为动态创建的输入调用 select2？

Answer 1

终于，我找到了解决方案

<select class="form-control sub-select2 select2_clinic_update" name="clinic_name" id="select2_clinic_update_{{$exp->id}}" style="width:100%">
   <option value="{{$exp->clinic_id}}" selected="selected">{{$exp->clinic->be_name}}</option>
</select>

我为 select2 提供了一个 class 并使用 class 名称初始化 select2。

$(".select2_clinic_update").select2({
  placeholder: 'Select clinic name',
  // dropdownParent: $('#editExperienceModal_1'),
  minimumInputLength: 2,

我从父模态中删除了 tabindex="-1"，所以在 select2 中不需要 dropdownParent。

在动态模态输入上选择 2

Select2 on dynamic modal input

jquery-select2