有个项目准备换个框架，研究了一周的dojo，东西是好，就是国内使用的人太少，奈何我英语水平有限，看不懂文档...所以转而研究easyui,字如其名，的确很easy，api非常详细。
老板说要让tree加载后让无权限的节点disabled状态,所以我在生成树的json里面加如了 "disabled"，
|
|
{
"id"
:
11
,
"text"
:
"搜索引擎"
,
"state"
:
"closed"
,
"children"
:[{
"id"
:
11
,
"text"
:
"百度一下"
,
"disabled"
:
"false"
}
|
就像酱紫了，然后在easyui.css 新加了2个样式
|
|
.tree-title-disabled {
font-size: 12px;
display: inline-block;
text-decoration: none;
vertical-align: top;
white-space: nowrap;
padding:
0
2px;
height: 18px;
line-height: 18px;
color:#ccc;
}
.tree-file-disabled {
background: url(
'images/tree_icons.png'
) no-repeat -256px
0
;
}
|
很明显，第一个就是字体是灰色，第二个就是换个图片而已
cc.push(
"<span class=\"tree-indent\"></span>"
);
if
(item.disabled==
"false"
){
//设置节点不可选
cc.push(
"<span class=\"tree-icon tree-file tree-dnd-no "
+(item.iconCls?item.iconCls:
""
)+
"\"></span>"
);
}
else
{
cc.push(
"<span class=\"tree-icon tree-file "
+(item.iconCls?item.iconCls:
""
)+
"\"></span>"
);
}
_1a2=
true
;
}
}
if
(opts.checkbox){
if
((!opts.onlyLeafCheck)||_1a2){
cc.push(
"<span class=\"tree-checkbox tree-checkbox0\"></span>"
);
}
}
if
(item.disabled==
"false"
){
//设置节点不可选
cc.push(
"<span title='无权进行操作' class=\"tree-title-disabled\">"
+opts.formatter.call(_19d,item)+
"</span>"
);
}
else
{
cc.push(
"<span class=\"tree-title\">"
+opts.formatter.call(_19d,item)+
"</span>"
);
}
cc.push(
"</div>"
);
|
然后就是对节点进行设置啦，item.disabled=="false"的时候就加载 -disabled样式,人性话一点呢，就在 <span>里面加个title,
最后呢就是前台选中节点的时候呢，如果disabled=="false"，返回false就可了
function
addPanel(node) {
if
(node.disabled ==
"false"
) {
return
false
;
}
else
{
if
($(
".easyui-tabs"
).tabs(
"exists"
, node.text + node.id)) {
$(
".easyui-tabs"
).tabs(
"select"
, node.text + node.id);
}
else
{
index++;
$(
'.easyui-tabs'
).tabs(
'add'
, {
title: node.text + node.id,
content:
'<div id='
+ index +
"_"
+ node.id +
' style="padding:10px;width:'
+ $("#easyui-tabs
").width() + 'px; height:600px"
><iframe src=' + node.url +
' width="100%" height="100%" style="border:solid 0px"></iframe></div>'
,
closable:
true
});
}
}
}
|
呐，就是这样的，这呢还实现了，如果有打开的tab，在节点选择的时候呢，已经打开的tab就呈选中状态，而不是在重新打开一个tab，最后就是这个效果了
记下来，免得以后忘了，刚开始研究，不要喷我哈....