如何在 Jquery 动态输入字段中使用 select2？

Question

我正在使用此插件使用动态输入字段 https://www.jqueryscript.net/table/duplicate-resort-rows-dynamic.html 和联系地址我正在使用 select2.Everything 工作正常预计当我尝试添加更多输入时 field.Everything 即将空预计联系地址 select2 box.and我也不能 select

这是我尝试在编辑中添加更多输入字段的时候 form.All 联系人姓名和联系人 phone 和电子邮件都为空，除了 contact_address 字段，我不能 select 地址到 .

这是我的html样子

   @foreach($contacts as $key => $contact)
              
            <tr>
                <td>
                  <input type="text" name="contact_name[]" value="{{ $contact->contact_name ?? null}}"
                       class="form-control" placeholder="{{ __('Contact Name') }}">
               </td>
               <td>
                <input type="text" name="contact_phone[]"  value="{{ $contact->contact_phone ?? null }}"
                           class="form-control" placeholder="{{ __('Contact Phone') }}">
                
                </td>
                <td>
                 <input type="text" name="contact_email[]"  value="{{ $contact->contact_email ?? null  }}"class="form-control" placeholder="{{ __('Contact Email') }}">
                </td>
                <td>
               
                    <select name="contact_address[]" data-selected="{{ old('contact_address',  $contact->contact_address ?? null) }}"
                            class="contact_address form-control" >
                     @foreach($addresses as $address)
                        <option value="{{$address->id}}" @if($address->id==$contact->contact_address) selected @endif>{{$address->name}},{{$address->district}}</option>
                        @endforeach
                    </select>
                
            </td>
                <td>
                <button class="btn btn-danger btn-sm" data-remove >
                    <i class="ni ni-fat-delete"></i>
                </button>
                <button class="btn btn-primary btn-sm"  data-add>
                    <i class="ni ni-fat-add"></i>
                </button>

            </td>
            </tr>
            @endforeach

我的脚本文件是这样的

$(document).ready(function() {
    $("tr select[name='contact_address[]']").select2({

        theme: "classic",
        allowClear: true,
        cache: true,
    });


});

Answer 1

尝试使用此代码：

$(function() {
  $('table[data-dynamicrows]').dynamicrows({
    beforeAdd: function($row) {
     
      $row.find('select.contact_address').select2("destroy");
    },
    afterAdd: function($row) {
      $row.find('select.contact_address').select2();
    }
  });
});

Answer 2

<script>
    $('document').ready(function(){
    $(".select2").select2();

    $('.select_all').on("select2:select", function (e) { 
        var data = e.params.data.text;
        if(data=='All'){
        $(".select_all > option").prop("selected","selected");
        $(".select_all").trigger("change");
        }
    });
});
</script>

如何在 Jquery 动态输入字段中使用 select2？

How to use select2 in Jquery Dynamic Input Field?

jquery

laravel

jquery-select2