View Full Version : How to capture AsyncTreeNode click events

18 Mar 2010, 7:31 PM
I'm sure this has been beaten to death, but can someone point me at a small example of a TreePanel that captures click and right-click events on AsyncTreeNodes?

Here's my treePanel, but I'm not sure how to properly add the listeners.

var tree = new Ext.tree.TreePanel({
loader: new Ext.tree.TreeLoader(),
useArrows: true,
autoScroll: true,
animate: true,
enableDD: true,
containerScroll: true,
border: false,

root: new Ext.tree.AsyncTreeNode({
expanded: true,
leaf: false,
text: 'My Tree',
children: children
}) /* ,
listeners: {
click: {
fn: clickListener

18 Mar 2010, 10:21 PM
And what's wrong with what you have?

I mean apart from you are listening for left click instead of contextmenu?

19 Mar 2010, 3:49 AM
And what's wrong with what you have?The code in the initial post shows the listeners section commented out. If I uncomment that, and include the callback below, my JS doesn't load in the browser.

clickListener = function (node, evnt) {
// The node argument represents the node that
// was clicked on within your TreePanel
I mean apart from you are listening for left click instead of contextmenu?Initially I was just trying to get a left-click event there. I was going to add right-click when the left-click was working.


19 Mar 2010, 4:32 AM
"doesn't load"?

What's that supposed to mean? You get a syntax error somewhere?

19 Mar 2010, 4:54 AM
you should learn to deal with js errors and work with a js console/debugger

i guess clickListener is out of scope. Try simple first

listeners: {
click: function(node) {

19 Mar 2010, 5:35 AM
"doesn't load"? What's that supposed to mean?

Viewport doesn't display (blank screen). When I comment out the code, the app displays properly.

You get a syntax error somewhere?

Actually, no syntax error reported in NetBeans, but I figured out the problem: a missing var keyword in front of the callback definition.

Another problem was my callback definition was after the reference. Once I added var and moved the definition prior to the reference, it worked.

Thank you for taking a look.


19 Mar 2010, 6:19 AM
NetBeans? Never heard of that browser.

19 Mar 2010, 8:52 AM
Netbeans is a php IDE. (and Java i think)

You have to look in browser for Javascript errors, IDE only shows some syntax errors, but can't resolve object errors.

Start simple with alert or console.log in click listener. i guess your function is out of scope.