13

我正在使用 select2 4.0 版，我正在尝试对从 ajax 调用获取其数据的选择框进行编程选择。

在文档中，我发现了如何以编程方式将值设置为常规 select2，但我无法弄清楚如何使用 ajax 选择来执行此操作。

如果我没记错的话，在旧版本中，您可以通过使用以下命令将数据传递给 select2 来设置当前值：

jQuery("selectbox").select2("data", data)

我已经尝试过了，并发送了一个带有 id、文本和结果的数据对象，但没有任何可见的反应，当我查询选择框的状态时，要查看所选值，它返回 null。

这个选项是被删除了，还是简单地改变了？在文档中哪里可以找到它，或者如何实现所需的行为？

4

4 回答 4

8

实现这一点的唯一方法是首先将一个<option>包含您想要选择的数据的选择域添加到选择域中，然后像使用常规选择框一样选择它。这也是 kevin-brown 在他们的 github 项目页面上的官方回答。

https://github.com/select2/select2/issues/3273

因此，基本上，如果您知道要选择什么，您可以轻松地从中创建一个<option>元素，将其添加到原始选择框，然后按其值选择它：

var option=jQuery("<option>").attr("value","your_id_here").html("your_text_here");
jQuery("selectbox").append(option);
jQuery("selectbox").val("your_id_here").trigger("change");
于 2015-10-08T11:56:27.883 回答
4

我也很想知道这个问题的完整答案，但这里有一个部分解决方案：

$('#select2-control-id').val('item-id').trigger('select2:select').trigger('change');

这似乎只在select2已经加载了您要求的项目时才有效 - 即它是您已经点击的项目。

您不仅必须手动打开下拉列表，以便它通过 AJAX 加载项目的第一页 - 您还必须实际单击要稍后以编程方式选择的项目。

这似乎是因为它仅在您实际单击它们时才添加<options>到底层元素。select

我看不到以编程方式告诉select2加载 AJAX 结果第一页的方法。

于 2015-10-08T02:12:32.210 回答
1

<select/>操作隐藏框很容易：

//set first option as selected 
$("select [value='0']").attr("selected","selected");
$("select").trigger("change");

演示

于 2015-10-14T20:28:31.410 回答
0

你可以试试这个。 

    var dataString = 'id='+$value;
    var promise = sendAjaxFunction('load_form.php?k=1',dataString);
    $("#LoadMachine").html("<img src='images/ajax-loader.gif' />");
    promise.success(function (data) {
        $("#LoadMachine").html(data);
        $("#MachineName").select2({
            placeholder: 'Select Operation Name ...',
            allowClear: true
        });
        return false;
    });

将数据加载到 Div #LoadMachine 中，结果您可以加载 select2。

于 2015-10-14T07:01:31.963 回答