在 select2 中预选值

Posted 2023-05-07

【中文标题】在 select2 中预选值

【英文标题】：Preselecting value in select2

【发布时间】：2014-04-24 06:46:46

【问题描述】：

Texbox 使用 Select2 动态填充远程调用以及如何设置预选值。这是代码

<input type="hidden" id="e6">

$("#e6").select2(
    placeholder: "Search for a movie",
    minimumInputLength: 1,
    ajax: 
        url: url,
        dataType: 'jsonp',
        data: function (term, page) 
            return 
                q: term, // search term 
                page_limit: 10, ; 
        , 
        results: function (data, page)  
                return results: data;
        
    
);    

我试过这个来预选值 1049

$('#e6').select2('val', '1049');

但这不会在文本框上设置值。

有什么想法吗？

【参考方案1】：

如果有人想知道如何解决这个问题

$("#e6").select2('data', id: '1049', text: 'MyLabel');

【讨论】：

你有一个错字 - $("#e6")

@smith 如何预选超过 1 个值？？

@VikashSingh 使用这个：[ id: '1049', text: 'MyLabel' , id: '10', text: 'Mybel' ]

【参考方案2】：

对我有用的解决方案（在文档中有描述）是：

$('#mySelect2').val('1'); // Select the option with a value of '1'
$('#mySelect2').trigger('change'); // Notify any JS components that the value changed

【参考方案3】：

你可以使用initSelection方法

initSelection: function(element, callback) 
callback(id: 1, text: 'default selection with id 1' );
,

检查此link 并加载远程数据部分here

【讨论】：

这不起作用，只有当您附加到的隐藏输入具有非空值属性时才会调用 initSelection。

【参考方案4】：

多选...

var li = $("#e6");
li.select2(
    placeholder: "Placeholder"
);

var unselected = li.find('option:not(:selected)');
var selected = [];
for (var i = 0; i < unselected.length; i++) 
    selected[i] =  id: unselected[i].value, text: unselected[i].text ;

li.select2('data', selected);

【参考方案5】：

我可以使用它

$("#e6").val("input id of the select2 option here").trigger("change")

【参考方案6】：

在 2019 年，这对我有用

    // Create a DOM Option and pre-select by default~
    var newOption = new Option(data.text, data.id, true, true);
    // Append it to the select
    $('#mySelect2').append(newOption).trigger('change');

【参考方案7】：

这对我有用

<script>
  $(function() 
    if (window.formPrefill) 
      // setTimeout to force script to run when all the stack on doc.ready is complete.
      setTimeout(() => $(".js-select2-companies").select2('data', window.formPrefill), 10);
    
  )
</script>

【参考方案8】：

根据文档，您可以这样进行多个预选：

$('#mySelect2').val(['1', '2']); 
$('#mySelect2').trigger('change'); // Notify any JS components that the value changed

https://select2.org/programmatic-control/add-select-clear-items