Select2未显示所选值

Question

我正在使用4.0.0完整版，以便它也支持3.5.2功能。我正在使用query选项填写结果。一切工作正常，但是当我从结果中选择一个项目时，它不显示它。

$(document).ready(function() { 
 
    $(".select").select2({ 
 
     minimumInputLength: 1, 
 
     query: function (query) { 
 
      if (query.term) { 
 

 
       var data = { results: [] }, i, j, s; 
 
       for (i = 1; i < 5; i++) { 
 
        s = ""; 
 
        for (j = 0; j < i; j++) { s = s + query.term; } 
 
        data.results.push({ id: query.term + i, text: s }); 
 
       } 
 
       query.callback(data); 
 
      } 
 
     } 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.js"></script> 
 

 
<select class="select" style="width:300px"></select>

Answer 1

这是受如何适配器被自动生成，引起与选择二的错误。因为Select2只会自动为阵列适配器（以及任何构建它们的任何东西，如AJAX）创建一个新的<option>，所以不使用它的任何东西都将无法在运行中生成新的选项。不幸的是，默认query decorator将包装SelectAdapter，它不是ArrayAdapter的子类。

您可以通过强制使用阵列适配器来解决此问题，方法是传入一个空数组data。

$(document).ready(function() { 
 
    $(".select").select2({ 
 
     minimumInputLength: 1, 
 
     data: [], 
 
     query: function (query) { 
 
      if (query.term) { 
 

 
       var data = { results: [] }, i, j, s; 
 
       for (i = 1; i < 5; i++) { 
 
        s = ""; 
 
        for (j = 0; j < i; j++) { s = s + query.term; } 
 
        data.results.push({ id: query.term + i, text: s }); 
 
       } 
 
       query.callback(data); 
 
      } 
 
     } 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.js"></script> 
 

 
<select class="select" style="width:300px"></select>

这should be reported as a bug到Select2 repository。