Javascript 无法在Choices.js中传递ajax选择选项

我正在使用Choices.js。我还使用Ajax从数据库中动态地将数据填充到select字段中。我面临的问题是当我使用以下代码时：

  const choices = new Choices('select',
      {
        loadingText: 'Loading...',
        searchEnabled: false,
        itemSelectText: '',
        removeItemButton: true,
      });

动态选择字段停止工作，数据不是来自ajax脚本。在这里，数据动态地来自第一个select-course字段中的DB。如果我删除上述参数，一切正常。但当我添加它时，它会中断，远程ajax数据不会填充

知道如何使来自DB的ajax数据显示在Choices.js中吗

我看到有一个使用setchoices添加的选项：

我不知道如何在我的代码中使用这些。任何帮助都将不胜感激

下面是html脚本

<div class="input-field">
                <div class="input-select">
                <select name="course_id" id="course_id" class="form-control input-lg dynamic" data-dependent="branch_id">
                    <option value="">Select Course</option>
                    @foreach($papers as $paper)
                    <option value="{{ $paper->course_id}}">{{ $paper->course_name }}</option>
                    @endforeach
                </select>

                </div>
              </div>
          <br>
          <div class="input-field">
                <div class="input-select">
                <select name="branch_id" id="branch_id" class="form-control input-lg dynamic" data-dependent="sem_id">
                  <option value="">Select Branch</option>

                </select>

                </div>
              </div>
              <br>
        <div class="input-field">
                <div class="input-select">
                <select name="sem_id" id="sem_id" class="form-control input-lg">
                  <option value="">Select Semester</option>
                </select>

                </div>
              </div> 

以下是Ajax：

  <script type="text/javascript">
    $(document).ready(function(){


  $('.dynamic').change(function(){
   if($(this).val() != '')
   {
    var select = $(this).attr("id");
    var value = $(this).val();
    var dependent = $(this).data('dependent');
    var _token = $('input[name="_token"]').val();
    $.ajax({
     url:"{{ route('dynamicdependent.fetch') }}",
     method:"POST",
     data:{select:select, value:value, _token:_token, dependent:dependent},
     success:function(result)
     {
      $('#'+dependent).html(result);
     }

    })
   }
  });

  $('#course').change(function(){
   $('#branch').val('');
   $('#sem').val('');
  });

  $('#branch').change(function(){
   $('#sem').val('');
  });


 });

    </script>

---

您可以使用settimeout

setTimeout(function () {
                    const choices = new Choices('[data-trigger]',
                        {
                            searchEnabled: false,
                            itemSelectText: '',
                        });
                }, 500);
function loadCategoryProduct() {
    $.ajax(
        {
            type: "POST",
            url: "/Product/GetProductCategory",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: "true",
            cache: "false",
            success: function (data) {
                var s = '<option placeholder="" value="0">Danh mục</option>';
                for (var i = 0; i < data.length; i++) {
                    s += '<option value="' + data[i].ProductCategoriesID + '">' + data[i].ProductCategoriesName + '</option>';
                }
                $("#ddlProductCategory").html(s);
                if (idCategoryProduct == "") {
                    $('#ddlProductCategory').val(0);
                }
                else {
                    $('#ddlProductCategory').val(idcountry);
                }
                setTimeout(function () {
                    const choices = new Choices('[data-trigger]',
                        {
                            searchEnabled: false,
                            itemSelectText: '',
                        });
                }, 500);
                
            },
            Error: function (x, e) {
                //alert("Some error");
            }
        });
}

---

您可以使用settimeout

setTimeout(function () {
                    const choices = new Choices('[data-trigger]',
                        {
                            searchEnabled: false,
                            itemSelectText: '',
                        });
                }, 500);
function loadCategoryProduct() {
    $.ajax(
        {
            type: "POST",
            url: "/Product/GetProductCategory",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: "true",
            cache: "false",
            success: function (data) {
                var s = '<option placeholder="" value="0">Danh mục</option>';
                for (var i = 0; i < data.length; i++) {
                    s += '<option value="' + data[i].ProductCategoriesID + '">' + data[i].ProductCategoriesName + '</option>';
                }
                $("#ddlProductCategory").html(s);
                if (idCategoryProduct == "") {
                    $('#ddlProductCategory').val(0);
                }
                else {
                    $('#ddlProductCategory').val(idcountry);
                }
                setTimeout(function () {
                    const choices = new Choices('[data-trigger]',
                        {
                            searchEnabled: false,
                            itemSelectText: '',
                        });
                }, 500);
                
            },
            Error: function (x, e) {
                //alert("Some error");
            }
        });
}