引入jsTree的文件jstree.min.js
<div class="ibox-content">
<div id="using_json"></div>
</div>
前端页面
最佳方式
<script src="/static/js/plugins/jsTree/jstree.min.js"></script>
$("#using_json").jstree({
core:{
data:{
url:"menu_tree",
dataFilter:function(data){
var json = JSON.parse(data);
return json;
}
},
strings: {
'Loading ...' : '正在加载...'
}
}
});
执行JavaScript事件进行重载(添加,删除,修改等)
$("#addmenu").submit(function () {
var data=$(this).serialize();
$.ajax({
url: 'menu_tree',
data: "" ,
type: 'POST',
dataType: 'json',
success: function(json) {
$("#using_json").jstree(true).settings.core.data = json;
$("#using_json").jstree(true).refresh();
}
})
});
效果图
要注意一点的是:父和子的Id值不能一样
、否则会出点击展开
所有东西消失