ext tree 动态修改各个节点名称icon小图标
"afterchildrenrendered":function(){
tree.getRootNode().eachChild(function(_node){
_node.setText("1111");//设置节点的文字
_node.getUI().getIconEl().src = "http://localhost:8080/web/images/icons/treeNodeLeafIcon.png";//设置icon小图标
});
}
ext tree 动态修改节点样式
function updateTreeNodeIcon(treeNode,oldIconCls,newIconCls){
if(!treeNode)
return;
var imgHtmlEl = treeNode.getUI().getIconEl();
treeNode.iconCls = newIconCls;
Ext.Element.fly(imgHtmlEl).removeClass(oldIconCls);
Ext.Element.fly(imgHtmlEl).addClass(newIconCls);
}
Ext 中的Tree实现不同节点不同的右键菜单
转自:http://kingapex.iteye.com/blog/150806
首先了解 Ext.Tree.Node.attributes的用法:
定义如下数据(其中有自定义类型type):
js 代码
[{"text":"a","id":"1","cls":"folder","type":"4"},{"text":"b","id":"2","cls":"folder","type":"3"}]
通过 Tree.TreeLoader 加载数据后可以通过如下语法读取type自定义属性
js 代码
node.attributes.type
了解自定义属性用法后可在Tree的contextmenu事件中控制不同类型的结点显示不同的菜单了,关键代码:
js 代码
prepareCtx:function(node, e){
node.select();
if(node.attributes.type=="3");{
ctxMenu.showAt(e.getXY());
}
if(node.attributes.type=="4"){
ctxMenu1.showAt(e.getXY());
}
}
完整例子见附件,注:此例子不中包含ext库文件,如需运行需将ext库文件放入ajax/yui目录