jQuery Select2子项未显示为选中状态

Question

I have a select2 box with "children" attribute in the data and it render as expected. 我在数据中有一个带有“ children”属性的select2框，它按预期方式呈现。 But in the edit screen when we select a child element its parent element persisted in the dropdown. 但是在编辑屏幕中，当我们选择子元素时，其父元素会保留在下拉列表中。 For example, when we select "Live Band" while in the add form but the edit form shows "Entertainment" as selected. 例如，当我们在添加表单中选择“ Live Band”时，但编辑表单显示为“ Entertainment”。 Please find the data format and source code I am using. 请找到我正在使用的数据格式和源代码。 Please help me to resolve this issue. 请帮助我解决此问题。

Data 数据

[
    {
        "id": "12",
        "text": "Personal Chef",
        "parent": "0",
        "order": 0
    },
    {
        "id": "11",
        "text": "Entertainment",
        "parent": "0",
        "order": 1,
        "children": [
            {
                "id": "37",
                "text": "DJ’s",
                "parent": "11",
                "order": 0
            },
            {
                "id": "38",
                "text": "Live Band",
                "parent": "11",
                "order": 1
            },
            {
                "id": "36",
                "text": "Clowns - Kids parties",
                "parent": "11",
                "order": 2
            }
        ]
    },
    {
        "id": "10",
        "text": "Motorcycle Repair",
        "parent": "0",
        "order": 2
    }
]

Source Code: 源代码：

$(".search-result-box").select2({
    placeholder: "eg: 1967 Stingray Mechanic",
    multiple: false,
    width: 225,
    selectOnBlur: true,
    data: data
});

$(".search-result-box").select2('val', 38); // Tried select2('val', "38") also.

Answer 1

I just tried your select2 example in the plunker and it's working as per your expectation. 我只是在plunker中尝试了select2示例，它按您的期望工作。

Please have a look and let me know if you are looking for anything else. 请看看，如果您还有其他需要，请告诉我。 Please also mention your jquery,select2 versions as well. 还请提及您的jquery，以及select2版本。

HTML: HTML：

<!DOCTYPE html>
<html>

<head>
  <script data-require="jquery@1.7.1" data-semver="1.7.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <link data-require="select2@*" data-semver="3.5.1" rel="stylesheet" href="//cdn.jsdelivr.net/select2/3.4.5/select2.css" />
  <script data-require="select2@*" data-semver="3.5.1" src="//cdn.jsdelivr.net/select2/3.5.1/select2.min.js"></script>

  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>

  <input type="hidden" class="search-result-box" />

</body>

</html>

JavaScript File: JavaScript文件：

$(function() {

   $(".search-result-box").select2({
     placeholder: "eg: 1967 Stingray Mechanic",
     multiple: false,
     width: 225,
     selectOnBlur: true,
     data: data
   });

  $(".search-result-box").select2('val', 38); // Tried select2('val', "38") also.

});

jQuery Select2子项未显示为选中状态

问题描述

1 个解决方案

解决方案1
2 已采纳 2014-11-24 06:12:51

jQuery Select2子项未显示为选中状态

问题描述

1 个解决方案

解决方案1 2 已采纳 2014-11-24 06:12:51

解决方案1
2 已采纳 2014-11-24 06:12:51