我正在使用一个JsTree(创建文件夹层次结构的J查询插件),实际上我想通过使用“create_node”方法创建一个父节点。 我尝试了下面的解决方案,但没有生成任何父节点或根节点,请帮助我在JSTREE中创建根节点。
null
$('#CountainerTree').jstree({ 'core' : {
'data' : [
{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },
{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },
{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },
{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" },
]
} });
function CreateRootFolder(){
$("#CountainerTree").jstree('create_node', '#', {'id' : 'myId', 'text' : 'My Text'}, 'last');
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.1.1/themes/default/style.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<button id="btnCreateNewRoot" onclick="CreateRootFolder()">Creat Root Folder</button>
<div id="divJsTreeParent" class="col-md-12 col-sm-12 col-xs-12">
<div id="CountainerTree" class="">
</div>
</div>
null
您需要将“check_callback”:true,
添加到core
选项中。
我不知道这到底是为了什么,但让它工作
null
$('#CountainerTree').jstree({ 'core' : {
"check_callback": true,
'data' : [
{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },
{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },
{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },
{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" },
]
} });
function CreateRootFolder(){
$("#CountainerTree").jstree('create_node', '#', {'id' : 'myId', 'text' : 'My Text'}, 'last');
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.1.1/themes/default/style.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<button id="btnCreateNewRoot" onclick="CreateRootFolder()">Creat Root Folder</button>
<div id="divJsTreeParent" class="col-md-12 col-sm-12 col-xs-12">
<div id="CountainerTree" class="">
</div>
</div>