无法设置select2的值

Question

我正在使用Select2 v4，我的对象已经被初始化：

在 *posts.blade.php* 中：

<select class="form-control" name="categories[]" multiple="multiple" id="cat_select">
  @foreach ($categories as $c)
   <option value="{{$c->id}}">{{$c->title}}</option>
  @endforeach
</select>

我已经使用用户可以手动选择的默认值进行了初始化。我有一个ajax函数，返回已在选择中初始化的类别。我希望返回的数据设置在选择中，但它没有起作用。例如，选择已经有选项“运动”，并且从ajax返回“运动”。我想选择“运动”。

JavaScript代码：

let select_cat = $("select#cat_select").select2();

我尝试过的。

$("#cat_select").val([data.title]).trigger("change"); //which doesn't work for some reason

- Muhammad Adistya Azhar

---

不，我正在遵循 https://select2.org/programmatic-control/methods 的文档，但我猜它做的是同样的事情。 - Muhammad Adistya Azhar

Answer 1

这是我的解决方案。我必须销毁select2，然后将值（数组）添加到选择器中，并重新初始化它。

  data.categories.map(function(el){
    my_categories.push(el.id);
   });
  $("#cat_select").select2('destroy');
  $("#cat_select").val(my_categories);
  $("#cat_select").select2();

- Muhammad Adistya Azhar

Answer 2

首先，您需要从控制器将所选值返回到 Blade 文件。

假设所选值存储在 $selected 中。请将其返回：

return view('posts', compact('selected'));

然后在你的blade文件中，必须添加以下脚本

 $(document).ready(function() {
      var selected = <?php echo json_encode($selected) ?>;
      $('#cat_select').select2();
      $('#cat_select').val(selected);
      $('#cat_select').trigger('change');
    });

这个解决方案对我很有效，我在任何需要 select2 选定值的地方都使用它。

- Bonish Koirala

---

抱歉，这与我在问题描述中尝试的完全相同。 - Muhammad Adistya Azhar

Answer 3

使用这个

$("#cat_select").select2('open');
var e = jQuery.Event("keyup");
e.which = 13;e.keyCode = 13;
$(".select2-search__field").val(data.title);
$(".select2-search__field").trigger(e);
$("#cat_select").select2('close');

- fammi farendra