json_data 加载后更改 jsTree 节点 css 类?
每当用户单击文件夹旁边的 [+] 时,我都会通过 json_data 加载 jsTree。我想要做的是将 css 类应用到某些节点以向用户突出显示它们。这里不是谈论鼠标悬停或当前选定的节点,而是一些人稍后必须查看的多个节点。适当的 css 类已经位于服务器的 JSON 响应中:
[
{"attr":{"id":"node_5","rel":"document","page_id":"4"},"data":"Test123","csscl":"ui-state-error","state":""},
{"attr":{"id":"node_6","rel":"folder","page_id":"6"},"data":"Services","csscl":"","state":"closed"}
]
我的“Test123”节点应该稍后在树中获得类“ui-state-error”。 这是我的 jsTree:
$(function () {
// Settings up the tree. note to self: dont use the cookie plugin here, this will always overwrite pre-selected nodes
$("#jstree").jstree({
"plugins" : [ "themes", "json_data", "ui", "types", "hotkeys",],
"json_data" : {
"ajax" : {
"url" : "inc/tree_server.php",
"data" : function (n) {
return {
"operation" : "get_children",
"id" : n.attr ? n.attr("id").replace("node_","") : 1
};
},
success: function(n) {
for (var i in n)
{
jqid = "#"+n[i].attr["id"]+" a";
$(jqid).addClass(n[i].csscl);
}
}
}
},
// the UI plugin
"ui" : {
// selected onload
"initially_select" : [ "node_<?=$p->oTopic->iId;?>" ]
},
// the core plugin
"core" : {
"initially_open" : [ <?=$p->oTopic->sJstreeOpenSeq;?> ],
"animation" : 0
}
})
这行不通。我认为发生的情况是,在加载树之后、绘制树或准备好 JQuery 查找所选节点并应用我的类之前,调用“success: function(n)”。 任何人都知道如何解决这个问题,或者也许有更好的方法将 css 类应用于 $("#node5 a") 在这种情况下......?
i load my jsTree via json_data whenever the user clicks the [+] next to a folder. What i want to do is apply css classes to some of the nodes to highlight them for the user. Not talking about mouse-hover or the currently selected node here, but multiple nodes some human has to review later. The appropriate css class is already inside the JSON response from the server:
[
{"attr":{"id":"node_5","rel":"document","page_id":"4"},"data":"Test123","csscl":"ui-state-error","state":""},
{"attr":{"id":"node_6","rel":"folder","page_id":"6"},"data":"Services","csscl":"","state":"closed"}
]
my "Test123" node should get class "ui-state-error" later in the tree.
Here is my jsTree:
$(function () {
// Settings up the tree. note to self: dont use the cookie plugin here, this will always overwrite pre-selected nodes
$("#jstree").jstree({
"plugins" : [ "themes", "json_data", "ui", "types", "hotkeys",],
"json_data" : {
"ajax" : {
"url" : "inc/tree_server.php",
"data" : function (n) {
return {
"operation" : "get_children",
"id" : n.attr ? n.attr("id").replace("node_","") : 1
};
},
success: function(n) {
for (var i in n)
{
jqid = "#"+n[i].attr["id"]+" a";
$(jqid).addClass(n[i].csscl);
}
}
}
},
// the UI plugin
"ui" : {
// selected onload
"initially_select" : [ "node_<?=$p->oTopic->iId;?>" ]
},
// the core plugin
"core" : {
"initially_open" : [ <?=$p->oTopic->sJstreeOpenSeq;?> ],
"animation" : 0
}
})
This won't work. What i think happens is that "success: function(n)" is called after the tree is loaded, but before it is drawn or ready for JQuery to find the selected node and apply my class.
Anyone knows how to solve this, or maybe there is a better way to apply a css class to $("#node5 a") in that case...?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我想我找到了解决方法。
然后在加载和绘制之后,您可以像这样调用函数:
I think I found a workaround.
And then after loading and drawing you can call function like this:
这可以更容易完成。将 success 函数替换为:
It can be done easier. Replace success function with this: