我在数据中有一个带有“ children”属性的select2框,它按预期方式呈现。但是,在编辑屏幕中,当我们选择子元素时,其父元素会保留在下拉列表中。例如,当我们在添加表单中选择“ Live Band”时,但编辑表单显示为“ Entertainment”。请找到我正在使用的数据格式和源代码。请帮助我解决此问题。
数据
[
{
"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
}
]
源代码:
$(".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.
我只是在plunker中尝试了您的select2示例,它按照您的期望工作。
请看一下,如果您还有其他需要,请告诉我。还请提及您的jquery,以及select2版本。
HTML:
<!DOCTYPE html>
<html>
<head>
<script data-require="[email protected]" 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文件:
$(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.
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句