當我選擇第一個時，jQuery Second Select框未填充

Question

我有以下ajax代碼，當選擇第一個選擇框時將觸發

$('#select_modal_name').on('change',function(){
      $('#loader').show();
       var myselect='';
      var pageurl =  'http://localhost/demo/public/';
        $.ajax({
        url: pageurl+'/brand-name',
        type: 'GET',

        success: function(data){
             $('#loader').hide();

               $.each(data, function( key, value ) {
                   myselect+='<option value="'+value.id+'" >'+value.brand_name+'</option>';   


});

 $('#try-this').append(myselect);

console.log(myselect);

         }

});
});

HTML代碼

<div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">Select Model</label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <select id="select_modal_name" class="selectpicker show-tick form-control" data-live-search="true">
          <option value="AK" selected>---Select--</option>
            @foreach($data as $key=>$val)
           <option value="{{$val->id}}">{{$val->brand_name}}</option>
           @endforeach;

        </select>
                        </div>
                      </div>
                     <div class="item form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">Model Parts Name <span class="required">*</span>
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                     <select id="basic select-parts-name" class="selectpicker show-tick form-control " data-live-search="true">

          <div id="try-this" class="try-this" ></div>
         <!--  <option value="AK" selected>---Select--</option>--->

        </select>
                        </div>

即使我已經警告了成功的Ajax數據輸出的選項是print.only問題是它沒有追加到選擇框

Answer 1

是的，終於解決了我的問題

問題是我正在使用selectpicker js設計選擇框。我使用類名附加了選項值並添加了selectpicker刷新

$('.selectpicker').append(myselect);
$('.selectpicker').selectpicker('refresh');

現在工作正常。