Select2 & Ajax - Загрузить значения с помощью select2 + ajax + multiple option

Question

Я пытаюсь отобразить некоторую информацию на моем компоненте select2, но он не работает на 100%.

После нескольких часов поисков, я сделал это:

<div class="row"> 
     <div class="col-md-12"> 
      {!! Form::label('lblRequisitos', 'Selecione os Requisitos') !!} 
      {!! Form::select('requisitos[]', $requisitosVaga, null, ['id'=>'requisito', 'class'=>'form-control js-states', 'multiple' => 'multiple']) !!} 
     </div> 
    </div> 

@push('scripts') 
<script> 
    $(function() 
    { 
     $('#requisito').select2(
     { 
      placeholder: "Escolha a habilidade...", 
      minimumInputLength: 2, 
      ajax: 
      { 
       url: '{{route('pesquisa-habilidade')}}', 
       dataType: 'json', 
       data: function (params) 
       { 
        return {q: $.trim(params.term)}; 
       }, 
       processResults: function (data) { 
        return { 
         results: data 
        }; 
       }, 
       cache: true 
      }, 
      initSelection : function (element, callback) { 
       var data = []; 
       $(element).find("option").each(function() { 
        data.push({id: $(this).val(), text: $(this).text()}); 
       }); 
       callback(data); 
      } 
     }); 
    }); 
</script> 
@endpush 

С его начальная нагрузка ок. Но когда я пытаюсь выполнить поиск следующего значения (когда я пытаюсь редактировать), он очищает все параметры.

Answer 1

Возможно, это не лучшее решение, но я исправлю это.

только добавить последующую строку:

//.... At select2 function ... 

initSelection : function (element, callback) { 
      var data = []; 
      $(element).find("option").each(function() { 
       data.push({id: $(this).val(), text: $(this).text()}); 

       // ADD this line to put the option selected 
       $(this).prop('selected', true); 
      }); 
      callback(data); 
     } 
// .... 

Теперь он работает на 100%.

У кого-нибудь есть лучшее решение?