Select 2 只处理数组的第一个元素

Question

我有一个数组，我在该数组中使用 select 2。 Select 2 在第一个元素上工作，但在其他元素上 select 2 不工作。

我的html:

@foreach($quizzes as $quiz)

<select class="js-example-basic-multiple grades" multiple id="grades" name="grades[]">
<option value="1">Form 1 History</option>
<option value="2">Form 2 History</option>    
</select>
@endforeach

我的脚本：

 <script>
$("#grades").select2();
$("#checkbox").click(function(){
  if($("#checkbox").is(':checked') ){
    $("#grades > option").prop("selected","selected");// Select All Options
    $("#grades").trigger("change");// Trigger change to select 2
  }
  else{
    $("#grades > option").removeAttr("selected");
    $("#grades").trigger("change");// Trigger change to select 2
  }
});

$("#button").click(function(){
  alert($("#grades").val());
});
$("#grades").select2({
  placeholder: "To be done by...",
  allowClear: true
});

 </script>

我似乎无法找出问题所在。

Answer 1

尝试用 class 名称而不是 ID 初始化 select2。元素 ID 在整个 DOM.

中应该是唯一的

$(".grades").select2({
  placeholder: "To be done by...",
  allowClear: true
});

并删除第一个 $("#grades").select2();

Select 2 只处理数组的第一个元素

Select 2 only working on the first element of an array

javascript

jquery

jquery-plugins

laravel

jquery-select2