如何设置jQuery Select2的选定值？

11 浏览
0 Comments

如何设置jQuery Select2的选定值？

这属于 Select2 版本 4 之前的代码。

我有一个简单的 select2 代码，它从 AJAX 获取数据。

$("#programid").select2({
  placeholder: "Select a Program",
  allowClear: true,
  minimumInputLength: 3,
  ajax: {
    url: "ajax.php",
    dataType: 'json',
    quietMillis: 200,
    data: function (term, page) {
      return {
        term: term, //search term
        flag: 'selectprogram',
        page: page // page number
      };
    },
    results: function (data) {
      return {results: data};
    }
  },
  dropdownCssClass: "bigdrop",
  escapeMarkup: function (m) { return m; }
});

这段代码是有效的，但是我需要在它上面设置一个值，就像在编辑模式下一样。当用户第一次选择一个值时，它将被保存，当他需要编辑该值时，它必须出现在相同的选择菜单 (select2) 中，以选择先前选择的值，但是我找不到一种方法。

更新：

HTML 代码：

Select2 程序化访问 不能与此一起使用。

admin 更改状态以发布 2023年5月23日
0

2 答案

0 Comments

动态设置 Select2 组件的 "selected" 值：

$('#inputID').select2('data', {id: 100, a_key: 'Lorem Ipsum'});

其中第二个参数是一个包含预期值的对象。

更新：

这确实有效，只想指出在新的 select2 中，"a_key" 在标准的 select2 对象中是 "text"，如下所示：{id: 100, text: 'Lorem Ipsum'}

示例：

$('#all_contacts').select2('data', {id: '123', text: 'res_data.primary_email'});

感谢 @NoobishPro

0
0 Comments

SELECT2 < V4

步骤 #1： HTML

步骤 #2： 创建 Select2 实例

$("#mySelect2").select2({
      placeholder: "My Select 2",
      multiple: false,
      minimumInputLength: 1,
      ajax: {
          url: "/elements/all",
          dataType: 'json',
          quietMillis: 250,
          data: function(term, page) {
              return {
                  q: term,
              };
          },
          results: function(data, page) {
              return {results: data};
          },
          cache: true
      },
      formatResult: function(element){
          return element.text + ' (' + element.id + ')';
      },
      formatSelection: function(element){
          return element.text + ' (' + element.id + ')';
      },
      escapeMarkup: function(m) {
          return m;
      }
});

步骤 #3： 设置所需的值

$("#mySelect2").select2('data', { id:"elementID", text: "Hello!"});

如果您使用没有 AJAX 的 Select2，则可以按照以下方式执行：





/* "One" will be the selected option */
$('[name=mySelect2]').val("0");

您也可以这样做：

$("#mySelect2").select2("val", "0");

SELECT2 V4

对于 Select2 v4，您可以直接附加选项，如下所示：

或用 JQuery：

var $newOption = $("").val("TheID").text("The text")
$("#myMultipleSelect2").append($newOption).trigger('change');

其他示例

$("#myMultipleSelect2").val(5).trigger('change');

0