在具有optGroup的select2中选择一个值

2021/01/27 23:11 · jquery ·  · 0评论

我正在向select2提供以下数据输入

data = [{
    "id": "all",
    "text": "All",
    "children": [{
        "id": "item1",
        "text": "item1"
    }, {
        "id": "item2",
        "text": "item2"
    }]
}];

我将select2初始化为:

$(parent).select2({"data":data});

现在选择值“ item1 ”,我做了

$(parent).select2("val",["item1"]);

但是,不是选择值“ item1而是选择了all ”。如何选择值item1?

要使用设置的值,select2您应该使用:

$(parent).val("item1").trigger("change");

发行说明中

您应该直接在基础元素上调用.val。如果需要第二个参数(triggerChange),则还应该在元素上调用.trigger(“ change”)。

$("select").val("1"); // instead of $("select").select2("val", "1");

JSFiddle,其中选择了item1。

JS:

var data = [{
    id: 'all',
    text: 'All',
    children: [{
        id: 'item1',
        text: 'item1'
    }, {
        id: 'item2',
        text: 'item2'
    }]
}];

$('.js-example-data-array').select2({data:data});

$('.js-example-data-array').select2('val',['item1']);

HTML:

<select class="js-example-data-array">
</select>

我试图进行此演示以向您展示它的工作原理。该演示将select标签用作空select元素和现有元素的选择器确实,我不知道您的意思是parent

<select>
</select>
<script>
data = [{
    "id": "all",
    "text": "All",
    "children": [{
        "id": "item1",
        "text": "item1"
    }, {
        "id": "item2",
        "text": "item2"
    }]
}];

$('select').select2({
    "data": data
});

$('select').select2("val", ["item2"]);

</script>

我不确定您是要在启动时选择值“ All”还是要通过代码选择“ item1”,否则它不起作用。我感到奇怪的是,“全部”被选择为值,因为即使将其添加也应将其视为类别。

$(".select2-text").select2("val",["item1"]);

它不会为我选择“全部”。如果我添加

$(".select2-text").select2("val",["item2"]);

它将为我选择“ item2”(这表示选择项目的方法有效,尽管这不是最佳方法,如Lelio Faieta的回答所述)

如果我加上

$(".select2-text").select2("val",["all"]);

它不会为我选择“全部”,只会显示一个空白选择。因此,我认为您的代码一定存在问题,因为在干净的页面中似乎无法选择“全部”

您能否向我们展示整个代码,包括页面的html(至少与select相关的部分)。我已经尝试过了(在这里查看plunker:http ://plnkr.co/edit/m6pFUt?p=preview

<script>
$(document).ready(function() {
    data = [{
        "id": "all",
        "text": "All",
        "children": [{
            "id": "item1",
            "text": "item1"
        }, {
            "id": "item2",
            "text": "item2"
        }]
    }];

    $(".select2-text").select2({
        "data": data
    });
});
</script>
<select class="select2-text"></select>

它以选择的item1开头,而“ All”被视为一个类别。因此,也许仅仅是因为您的代码/ HTML中有问题。

您正在使用哪个版本的Select2?
我正在使用2-4.0.0

本文地址:http://jquery.askforanswer.com/zaijuyouoptgroupdeselect2zhongxuanzeyigezhi.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!