如何在Jquery-Select2中设置多值选择中的选定值?

问题描述 投票:0回答:16
jquery ajax jquery-select2
16个回答
69
投票

实际上你只需要 $.each 来获取所有值,它将帮助你jsfiddle.net/NdQbw/5

<div class="divright">
            <select id="drp_Books_Ill_Illustrations" class="leaderMultiSelctdropdown Books_Illustrations" name="drp_Books_Ill_Illustrations" multiple="">
                <option value=" ">No illustrations</option>
                <option value="a" selected>Illustrations</option>
                <option value="b">Maps</option>
                <option value="c" selected>selectedPortraits</option>
            </select>
    </div>

<div class="divright">
        <select id="drp_Books_Ill_Illustrations1" class=" Books_Illustrations" name="drp_Books_Ill_Illustrations" multiple="">
            <option value=" ">No illustrations</option>
            <option value="a">Illustrations</option>
            <option value="b">Maps</option>
            <option value="c">selectedPortraits</option>
        </select>
</div>

<button class="getValue">Get Value</button>
<button  class="setValue"> Set  value </button>

<div class="divright">
        <select id="drp_Books_Ill_Illustrations2" class="leaderMultiSelctdropdown Books_Illustrations" name="drp_Books_Ill_Illustrations" multiple="">
            <option value=" ">No illustrations</option>
            <option value="a" selected>Illustrations</option>
            <option value="b">Maps</option>
            <option value="c" selected>selectedPortraits</option>
        </select>
</div>

<div class="divright">
        <select id="drp_Books_Ill_Illustrations3" class=" Books_Illustrations" name="drp_Books_Ill_Illustrations" multiple="">
            <option value=" ">No illustrations</option>
            <option value="a">Illustrations</option>
            <option value="b">Maps</option>
            <option value="c">selectedPortraits</option>
        </select>
</div>

<button class="getValue1">Get Value</button>
<button  class="setValue1"> Set  value </button>

剧本:

 var selectedValues = new Array();
    selectedValues[0] = "a";
    selectedValues[1] = "c";

$(".getValue").click(function() {
    alert($(".leaderMultiSelctdropdown").val());
});
$(".setValue").click(function() {
   $(".Books_Illustrations").val(selectedValues);
});

$('#drp_Books_Ill_Illustrations2, #drp_Books_Ill_Illustrations3').select2();


$(".getValue1").click(function() {
    alert($(".leaderMultiSelctdropdown").val());
});

$(".setValue1").click(function() {
    //You need a id for set values
    $.each($(".Books_Illustrations"), function(){
            $(this).select2('val', selectedValues);
    });
});

53
投票

我发现这篇文章很旧,但 select2 的工作方式现在已经发生了变化,这个问题的答案非常简单。

在多选2中设置值如下

$('#Books_Illustrations').val([1,2,3]).change();

不再需要在 jquery 中指定

.select2
,只需
.val

有时您不想触发

change
事件,因为您可能还有一些其他代码要执行,如果您使用上面的方法,就会发生这种情况,所以为了解决这个问题,您可以在不触发的情况下更改值像这样的
change
事件

$('#Books_Illustrations').select2([1,2,3], null, false);

如果这不起作用,您也可以这样做以不触发更改事件

$('#Books_Illustrations').select2();
$('#Books_Illustrations').val('some_value');

22
投票

所以我认为你想要默认选择2个选项,然后获取它的值?如果是这样:

http://jsfiddle.net/NdQbw/1/

<div class="divright">
    <select id="drp_Books_Ill_Illustrations" class="leaderMultiSelctdropdown Books_Illustrations" name="drp_Books_Ill_Illustrations" multiple="">
        <option value=" ">No illustrations</option>
        <option value="a" selected>Illustrations</option>
        <option value="b">Maps</option>
        <option value="c" selected>selectedPortraits</option>
    </select>
</div>

并获得价值:

alert($(".leaderMultiSelctdropdown").val());

设置值:

 $(".leaderMultiSelctdropdown").val(["a", "c"]);

您还可以使用数组来设置值:

var selectedValues = new Array();
selectedValues[0] = "a";
selectedValues[1] = "c";

$(".Books_Illustrations").val(selectedValues);

http://jsfiddle.net/NdQbw/4/


15
投票

使用 select2 jquery 库:

$('#selector').val(arrayOfValues).trigger('change')

7
投票
var valoresArea=VALUES
// it has the multiple values to set separated by comma
var arrayArea = valoresArea.split(',');
$('#area').select2('val',arrayArea);

7
投票
This is with reference to the original question
$('select').val(['a','c']);
$('select').trigger('change');

4
投票

看看这个会有帮助的。

var valoresArea=VALUES // it has the multiple values to set, separated by comma
var arrayArea = valoresArea.split(',');
$('#area').val(arrayArea);

网址是- 链接


4
投票

您可以将选定的值添加到

array
中并将其设置为默认选择的值

例如:

var selectedItems =[];
selectedItems.push("your selected items");
..
$('#drp_Books_Ill_Illustrations').select2('val',selectedItems );

试试这个,这肯定有效!


2
投票

这行不通。即使列表中两个选项均可用,也仅预先选择一个值,仅显示第一个值

('#searchproject').select2('val', ['New Co-location','Expansion']);


2
投票

使用 select2 库有 2 种设置值的方法 1.当存在单个值时,您可以将其作为字符串传递

$("#elementid").select2("val","valueTobeset")

2.当您将 select2 与多选选项一起使用时,您可以将值数组传递给 select2,所有这些值都将被设置

var arrayOfValues = ["a","c"]
$("#elementid").select2("val",arrayOfValues)

请记住,您可以通过传递数组来设置多选的单个值,也像这样

var arrayOfValues = ["a"]
$("#elementid").select2("val",arrayOfValues)

2
投票

使用如下多选功能。

$("#drp_Books_Ill_Illustrations").val(["val1", "val2"]).trigger("change");


2
投票

选择全部

 $('select[name=eventsFilter]').find('option').attr('selected', true);
$('select[name=eventsFilter]').select2();

取消选择全部

$('select[name=eventsFilter]').find('option').attr('selected', false);
  $('select[name=eventsFilter]').select2("");

0
投票

不需要做那么多事情。 使用多个 select2 设置值 var selectedvalue =“1,2,3”; //如果选择了前 3 个产品。 $('#ddlProduct').val(selectedvalue);


0
投票
$('#area').select2().val(arrayArea).trigger('change'); 

我以前很喜欢这个,我正在使用 select2 version4。我得到结果了


0
投票

这对我有用:

$(".Books_Illustrations").val(["a", "c"]).trigger('change');

-5
投票

使用如下多选功能。

$('#drp_Books_Ill_Illustrations').multiSelect('select', 'value');
© www.soinside.com 2019 - 2024. All rights reserved.