我正在使用jstree v.3.
我有一个工作示例,其中所有数据都是通过ajax从服务器端下载的.
$('#tree').jstree({
'core': {
'data': {
'url': "/ajax/getAll",
'data': function(node) {
return {'id': node.id};
},
// "check_callback" : true
}
},
"types": {
"category": {
"icon": "/img/category.png"
},
"page": {
"icon": "/img/page.png"
}
},
"plugins" : ["types"]
});
但我有很多数据要呈现.我想加载被点击的项目的数据.我没有服务器端的问题,但我找不到jstree部分的例子.任何人都可以分享代码或提供建议吗?
最佳答案 你刚刚找不到合适的关键字.它被称为延迟加载.
你必须写下这样的东西:
$("#treeCell").jstree({
"json_data" : {
"ajax" : {
"url" : function( node ){
// lets figure out the url - this function needs to
// return the formed URL. If "node" is "-1" then
// this is the top of the hierarchy and there's no parent
// key. Otherwise, node is a jquery object of
// the respective node from which we can fish out the
// metadata needed. (added below at "metadata" : op )
if( node == -1 ){
return "/list?parentkey="
} else {
return "/list?parentkey=" + node.data( "key" );
}
},
"type" : "get", // this is a GET not a POST
"success" : function(ops) {
// this is called when the AJAX request is successful. "ops"
// contains the returned data from the server, which in
// my case is a json object containing an array of objects.
data = []
// go through data and create an array of objects to be given
// to jsTree just like when you're creating a static jsTree.
for( opnum in ops ){
var op = ops[opnum]
node = {
"data" : op.info,
"metadata" : op ,
// THIS LINE BELOW IS THE MAGIC KEY!!! This will force
// jsTree to consider the node
// openable and thus issue a new AJAX call hen the
// user clicks on the little "+" symbol or
// whatever opens nodes in your theme
"state" : "closed"
}
data.push( node );
}
return data; // this will return the formed array
// "data" to jsTree which will turn
// it into a list of nodes and
// insert it into the tree.
}
},
},
"core" : {"html_titles" : true, "load_open" : true },
"plugins" : [ "themes", "json_data", "ui", "cookies", "crrm", "sort" ]
});