PDA

View Full Version : tree icon needs classname for proper styling in IE



neongrau
30 Mar 2007, 2:38 AM
instead of just
"x-tree-node-icon" it needs a class that reflects the collapsed/expanded state

currently when using the cls attribute on a treenode to style the node icon it's impossible to nest folders with different expanded/collapsed icons and style them properly for IE.

this problem only occurs in IE6+7 when having folders nested and and different expanded/collapsed icons applied. and only on the expanded state!

a possible fix would be to apply the replaceClass() in Ext.tree.TreeNodeUI.prototype.updateExpandIcon not only to this.elNode but to this.iconNode as well.


see this thread for more details

http://extjs.com/forum/showthread.php?t=3726

jack.slocum
3 Apr 2007, 11:34 AM
There is a new option that should fix this in the trunk.

I have added a new attribute "iconCls" which is applied directly to the node's icon. Using it in combo with cls could give even more flexibility.

neongrau
4 Apr 2007, 2:28 AM
thanks jack, thats great :)

now you can use such class combos
.x-tree-node-expanded img.folder_220 {...
.x-tree-node-collapsed img.folder_220 {...

without having to rely on IE's crappy multiclass behavior :))

dias
11 Jul 2008, 1:49 PM
Can someone post a example how to do this?

broox
26 Aug 2008, 9:03 AM
yeah, it's fairly simple.

in the json you use to load your tree view simply add "iconCls" like so:


[{

"text":"Users",
"id":"users",
"cls":"folder",
"expanded": true,
"children":

[{

"text":"Add User",
"id":"add_user",
"leaf":true,
"cls":"file",
"iconCls":"tree-new-icon"
}]

}]

then, in your css you'd simply define your rule to change the icon, similar to this...

.x-tree-node-leaf img.tree-new-icon { background-image:url(/resources/images/default/tree/drop-add.gif); }

cuocthiseo01
14 Feb 2009, 1:36 AM
detail guides, I've just fixed it

iceblast_01
11 Aug 2009, 3:44 AM
this only works if the node is leaf:true? how bout the ones with leaf:false? does this also work? can i have some examples? thanks!

manzaposse
24 Feb 2010, 7:37 AM
for me this fix is ok, tnx a lot!