25

我正在使用很棒的select2创建多选组合。

我想以编程方式选择默认值（如用户之前所做的选择），但我不知道如何。我读到使用 initSelection 可以解决问题，但是在创建组合时会调用它，我不希望始终执行此默认选择。

4

11 回答 11

19

4.x 版中的正确解决方案，例如：

$('#element').val(['val1','val2']).trigger('change');

请参阅：创建者说明

于 2016-12-18T07:49:29.503 回答
7

I found some solutions, maybe that will help you:

$('#el').select2({...}) // init select2

var defaultData = [{id:1, text:'Item1'},{id:2,text:'Item2'},{id:3,text:'Item3'}];

$('#el').data().select2.updateSelection(defaultData);
于 2013-05-22T14:22:12.393 回答
3

从文档页面：

" val - 获取或设置选择。如果没有指定value参数，则返回当前选择元素的id属性。如果指定了value参数，它将成为当前选择。"

另外，从文档中：

$("#e8").select2("val", "CA");
于 2013-04-22T08:59:49.357 回答
3

如此处文档中所述，您可以简单地将“选项”添加到您的选择标记中，以预先选择初始默认值。

<select class="js-data-example-ajax">
  <option value="3620194" selected="selected">select2/select2</option>
</select>
于 2016-01-25T18:07:50.847 回答
2

$('#el').select2().val(['val1','val2']).trigger("change")

可以解决问题，但由于某些原因，它消除了添加您自己的标签的能力......

于 2016-08-09T17:46:59.690 回答
0

以下代码工作正常，但select2需要刷新

$('#el').data().select2.updateSelection(defaultData);
于 2014-01-13T11:56:59.787 回答
0

扩展@sanj的答案。这似乎在我的项目中为我工作。

通过 HTML

HTML

<select class="select2" style='width:100%;' multiple>
    <option val=''>Please choose</option>
    <option val="1" selected>One</option>
    <option val="2" selected>Two</option>
    <option val="3">Three</option>
</select>

JS

$('.select2').select2();

结果 在此处输入图像描述

通过 Javascript

HTML

<select class="select2" style='width:100%;' multiple>
    <option val=''>Please choose</option>
    <option val="1">One</option>
    <option val="2">Two</option>
    <option val="3">Three</option>
</select>

JS

$('.select2').select2();
var defaultData = [{id:1, text:'One'},{id:2,text:'Two'}];
$('.select2').data().select2.updateSelection(defaultData);

结果 在此处输入图像描述

于 2016-11-08T10:40:32.407 回答
0 

<select class="form-control" id="selectid" name="selectid"></select>

$('#selectid').select2({
placeholder: 'Please Search with ID',
ajax: {
url: '/getData.php',
dataType: 'json',
delay: 250,
processResults: function (data) {
    return {
        results: data
    };
},
cache: true
}
});

var id    = "idvalue";
var text  = "Text String";
if(id !== null && id !== ''){
    var studentSelect = $('#selectid');
    $.ajax({
        type: 'GET',
        url: '/getData.php'
    }).then(function (data) {
        var option = new Option(id, text, true, true);
        studentSelect.append(option).trigger('change');
        studentSelect.trigger({
            type: 'select2:select',
            params: {
                data: data
            }
        });
    });
}
于 2021-07-09T14:36:42.840 回答
0

终于想通了！！<option>Select2遍历<select>.

<select class="js-data-example-ajax" style="width:100%">
  <option value="3620194" selected="selected">Put the pre-selected options here</option>
</select>

的内部 html<option>被放入 text 键下的 repo 对象中。所以repo.text会给innerhtml。也就是说，我们所要做的就是提供initrepo.text中的formatSelection选项。此外，从 servlet（控制器）传递的 json 应该将所需的标签文本放在text键下！！仍在研究如何为创建的 li 元素添加属性，以便我可以保存更改后的列表。有任何想法吗？

于 2017-03-30T10:26:18.943 回答
0

我遍历了一组值，然后将每个匹配的选项设置为 ("selected",true)

values = [2, 5, 3]

for val in values
  $("#selects_id option[value="+val+"]").prop("selected",true).trigger("change")

您还可以处理从 Ajax 调用获得的结果。

于 2017-12-12T18:12:19.317 回答
-1

您可以在此处找到解决方案，其中包含使用 JQuery Select2的自动完成、多选下拉列表。

将数据与 HTML“select”元素绑定，然后由“Select2”函数接管，将其转换为漂亮的多选下拉列表。

使用 AJax 可能会表现良好，并且肯定会在未来几天内尝试。

于 2013-07-14T06:00:01.340 回答