有個項目准備換個框架，研究了一周的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，最后就是這個效果了
記下來，免得以后忘了，剛開始研究，不要噴我哈....