首页 文章

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

提问于
浏览
40

大家好我用Jquery-Select2绑定我的下拉列表 . 它工作正常,但现在我需要使用Jquery-Select2绑定我的多值selectBox .

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

从这个链接http://ivaynberg.github.com/select2/我正在使用多值选择框,我可以绑定我的dropdwon

$("dropdownid").Select2()

它工作正常,但现在我需要将所选值添加到我的编辑模式下拉菜单中所以我使用此示例

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

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

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

13 回答

  • 7

    实际上你只需要$ .each来获得所有 Value ,它会帮助你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);
        });
    });
    
  • -1

    所以我认为你想要默认选择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>
    

    并获得 Value :

    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/

  • 14

    我觉得这篇文章已经过时了,但是现在对select2的工作方式有所改变,现在这个问题的答案非常简单 .

    要在多选择2中设置值,请执行以下操作

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

    无需再在jquery中指定 .select2 ,只需 .val

    还有一些时候你不会想要触发 change 事件,因为你可能有一些其他代码会执行,如果你使用上面的方法将会发生这种情况,以便你可以改变值而不触发 change 事件像这样

    $('#Books_Illustrations').select2([1,2,3], null, false);
    
  • 0
    var valoresArea=VALUES
    // it has the multiple values to set separated by comma
    var arrayArea = valoresArea.split(',');
    $('#area').select2('val',arrayArea);
    
  • 3

    只要看看它会有所帮助 .

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

    该网址是link

  • 0

    您可以在 array 中添加所选值,并将其设置为默认选择的值

    例如:

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

    试试这个,这绝对有用!

  • 2

    使用select2 jquery库:

    $('#selector').val(arrayOfValues).trigger('change')
    
  • 49
    This is with reference to the original question
    $('select').val(['a','c']);
    $('select').trigger('change');
    
  • 3

    没必要做那么多事情 . 对于使用多个select2 var selectedvalue =“1,2,3”的设定值; //如果选择了前3个产品$( '#ddlProduct')VAL(的SelectedValue) .

  • 3

    这不起作用 . 即使两个选项都在列表中可用,也只预选了一个值,只显示第一个 ('#searchproject').select2('val', ['New Co-location','Expansion']);

  • 0

    这是一行简单的解决方案 .

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

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

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

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

    2.当您使用带有多选选项的select2时,您可以将值的数组传递给select2,并且将设置所有这些值

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

    记住你可以通过传递一个像这样的数组来设置multiselect上的单个值

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

    使用多选功能如下 .

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

相关问题