Select2 4.0.1 小部件打开时如何选择选项？答案

【问题标题】：How to have option already be selected when the Select2 4.0.1 widget opens?Select2 4.0.1 小部件打开时如何选择选项？
【发布时间】：2016-03-03 23:30:06
【问题描述】：

我目前有一个功能强大的小部件，它接受多个选项。该小部件位于带有“保存”按钮和其他按钮的弹出窗口内。当我单击“保存”时，弹出窗口关闭，将选择保存到数据库中，自动运行数据库中的查询，并在 DataView 中显示结果。

现在，当我再次打开弹出窗口时，Select2 小部件中的文本字段为空。我希望它获取数据库中的数据并在打开时将它们显示在小部件中。我已经对其进行了设置，以便它返回一个应该是 ID 的字符串数组（这就是小部件检索正确数据所需的全部内容）。

所以我的问题是：我该如何修改小部件，以便它可以接收一个数组并在创建小部件时将它们显示为已选择的选项？

实际上我不太确定在这种情况下显示我的代码会做什么，但以防万一，它们是：

$("#select2").select2({
  placeholder: "Select materials...",
  closeOnSelect: false,
  ajax: {
    url: this.targetUrl,
    delay: 200,
    dataType: 'json',
    data: function(params) {
      return {
        code: params.term ? params.term + "*" : "*",
        page: params.page || 1
      };
    },
    processResults: function(data, params) {
      params.page = params.page || 1;
      var results = [];
      for (var i = 0; i < (data.length >= 25 ? 25 : data.length); i++) {
        results.push({
          id: data[i].code,
          text: data[i].code
        });
      }
      return {
        itemCode: results,
        results: results,
        pagination: false
      };
    },
    cache: true
  },
  maximumSelectionLength: 5,
  escapeMarkup: function(markup) {
    return markup;
  }
});

【问题讨论】：

你有没有机会解决这个问题？如果没有，我会尽力帮助你
@Reddy 不，我无法让它工作...您的帮助将不胜感激！
I would like for it to fetch the data that's in the database and display them in the widget when it opens 您想从第二次打开弹出窗口时开始执行此操作？？如果第一次打开弹出窗口时什么也没做怎么办？您希望第二次在弹出窗口中显示哪些与第一次不同的数据？
@Reddy 我希望弹出窗口包含我选择的选项。所以只要它没有更新，不只是第二次打开它，而是之后的任何时候。如果没有添加/更改任何内容，我将禁用“保存”按钮，所以我猜第二次没有什么不同。
所以你说你只是想保留弹窗的状态对吧？？

标签： javascript jquery jquery-select2 jquery-select2-4 select2

【解决方案1】：

当使用组件执行不同的操作时，Select2 将触发一些不同的事件，允许您添加自定义挂钩并执行操作。如：“更改”事件，只要选择或删除选项时触发。

所以你可以使用

$("#select2").val($selected).trigger("change");

在您的问题代码之后以编程方式控制您的 select2。

$selected 以上是您从服务器端请求的数据。它应该是一个数组，例如 ["12", "23", "34"]。

希望能帮到你。

参考select2

【讨论】：