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

hi all i am binding my dropdown with Jquery-Select2. Its working fine but now i need to Bind my Multi-Value selectBox by using Jquery-Select2.

嗨，我正在用Jquery-Select2绑定下拉菜单。它可以正常工作，但是现在我需要使用Jquery-Select2绑定我的multivalue selectBox。

My DropDwon

我DropDwon

    <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">Illustrations</option>
                            <option value="b">Maps</option>
                            <option value="c">Portraits</option>


                        </select>
                    </div>

From this link http://ivaynberg.github.com/select2/ i am using Mutiple Value Select Box , I can Bind my dropdwon with

在这个链接http://ivaynberg.github.com/select2/中，我使用的是Mutiple值选择框，我可以用它绑定dropdwon

   $("dropdownid").Select2()

its working fine, but now i need to get that selected value into my dropdown on edit mode So i am using this Example

它工作得很好，但是现在我需要在编辑模式下拉菜单中输入所选的值，所以我正在使用这个例子

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

its working but how can i fix my choice, because user can choice anything So i can't write a,c statically thats why i need to bind my Selected value on Edit mode dynamically.

它可以工作，但是我如何修正我的选择，因为用户可以选择任何东西，所以我不能静态地写一个，c这就是为什么我需要动态地在编辑模式上绑定我选择的值。

I think now you all are clear with my requirement. Please let me know if you need further clearance.

我想现在你们都明白我的要求了。如果你需要进一步的许可，请告诉我。

13 个解决方案

#1

Well actually your only need $.each to get all values, it will help you jsfiddle.net/NdQbw/5

实际上你只需要$。为了获取所有值，它将帮助您获取jsfiddley .net/ ndqbw5

<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>

The script:

脚本:

 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);
    });
});

#2

So I take it you want 2 options default selected, and then get the value of it? If so:

我取它你想要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>

And to get value:

并得到的值:

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

To set the value:

设置的值:

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

You can also use an array to set the values:

还可以使用数组设置值:

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

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

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

#3

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

#4

Just look at this one it will helps.

看看这个，会有帮助的。

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

the URL is- link

——链接的URL

#5

you can add the selected values in an array and set it as the value for default selection

可以在数组中添加所选值，并将其设置为默认选择的值

eg:

例如:

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

Try this, this should definitely work!

试试这个，这绝对有用!

#6

Using select2 jquery library:

使用select2 jquery库:

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

#7

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

#8

I get this post is old but there have been changes to how select2 works now and the answer to this question is extremely simple now.

我知道这篇文章已经过时了，但是select2现在的工作方式发生了变化，这个问题的答案现在非常简单。

To set the values in a multi select2 is as follows

要在多个select2中设置值，如下所示。

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

There is no need to specify .select2 in jquery anymore, simply .val

不再需要在jquery中指定.select2，只需.val即可

#9

no need to do so many things. for set value using multiple select2 var selectedvalue="1,2,3"; //if first 3 products are selected. $('#ddlProduct').val(selectedvalue);

没有必要做这么多事情。对于使用多个select2 var selectedvalue="1,2,3"的设置值;//如果选择前三种产品。$(' # ddlProduct ').val(selectedvalue);

#10

Using select2 library there are 2 ways to set the value 1. when single value is present you can pass it as string

使用select2库，有两种方法可以设置值1。当单个值存在时，可以将其作为字符串传递

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

2. when you are using select2 with multiselect option you can pass an array of the values to select2 and all those values will be set

2。当您使用select2和multiselect选项时，您可以将一个值数组传递给select2，所有这些值都将被设置

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

remember that you can set single value on multiselect by passing an array also like this

请记住，您可以通过传递这样的数组来对多选择设置单个值。

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

#11

This doesn't work. only one value is ever pre-selected even though both options are available in the list only the first is shown ('#searchproject').select2('val', ['New Co-location','Expansion']);

这并不工作。即使列表中有两个选项，但只有一个值是预先选择的('#searchproject')。select2(“val”,“新主机代管”,“扩张”]);

#12

Here is one line simple solution.

这是一行简单的解。

EX : var ArrayValue = ["a","b","c"];

例:var ArrayValue = ["a"，"b"，"c"];

 $("#select2id").select2("val",(ArrayValue).split(','));

#13

-1

Use multiselect function as below.

使用multiselect函数如下所示。

$('#drp_Books_Ill_Illustrations').multiSelect('select', 'value');

#1