PDA

View Full Version : TreePanel w/AsyncTreeNode Icon Issues


Jul
04-06-2007, 07:57 PM
My AsyncTreeNodes are changing their icons dynamically by sending back different class names with the cls: attribute. It's been working great. My CSS code for each custom icon looks like this:
.treemenu-user-node .x-tree-node-icon {
background:transparent url(/icons/User.gif) repeat scroll 0%;
}

However, I continued to tweak my TreePanel design a bit further and found a problem. I wanted to also control the folder icons. FireBug revealed the css classes to use (or so I thought) and I wrote a pair of css classes to deal with closed and open states. Here's what those look like:
.treemenu-blue-folder .x-tree-node-collapsed .x-tree-node-icon {
background:transparent url(/icons/FolderClosed.gif) repeat scroll 0%;
}
.treemenu-blue-folder .x-tree-node-expanded .x-tree-node-icon {
background:transparent url(/icons/FolderOpen.gif) repeat scroll 0%;
}

Those are being ignored no matter what I seem to do. The default folder icons are used. Any suggestions on what's wrong?

Thanks,
Jul

jack.slocum
04-06-2007, 09:19 PM
Hi Jul,

This thread in the bug forum should help:

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

It links to another thread that has even more info.

In SVN, there is a new attribute "iconCls" which can be used to work around this issue.

Let me know if this solves the problem for you.

Thanks.

Jul
04-07-2007, 02:01 AM
Hi Jack,

Thanks for the link. I see someone beat me to that problem.

Well, I have everything checked out from svn, but the file structure is in a different format from the normal file archives I'm used to. It looks like the *-all.js files, which I use, haven't been built.

I'm sure there must be a way to create those files. Once I figure this building process out, I'll check the iconCls update and let you know how it works.

- Jul

Jul
04-07-2007, 02:30 AM
Maybe I'm being dense, but I can't seem to find anything on how to build the ext-all.js file from the code in svn. The forum doesn't allow you to search for svn or "ext-all" and I've read several pages back in the forums without any success.

Any pointers on where to look would be greatly appreciated.

Thanks,
Jul

jack.slocum
04-07-2007, 09:44 AM
Included in SVN are jsb project files (3 of them). With those files and JS Builder (http://code.google.com/p/js-builder/) you can the exact same download distributed for Ext.

Jul
04-07-2007, 02:18 PM
Thanks for the pointer on how to build the files. I have everything built now. I'll start testing the new iconCls functionality.

Jul
04-07-2007, 03:10 PM
The "iconCls" attribute works perfectly.

I have one icon that needs to be the same whether it's expanded or contracted. I had to experiment, but I found that this css will work:

.x-tree-node-el .treemenu-user-folder {
background:transparent url(/icons/User.gif) repeat scroll 0%;
}

I hope using .x-tree-node-el in the selector is OK.

Thanks for your help!

jack.slocum
04-07-2007, 03:58 PM
No problem. Thanks for for letting me know it worked. :)