PDA

View Full Version : Ext.tree.Panel itemdblclick thwarted by addition of itemclick listener



myExtJsUname
5 Dec 2012, 9:41 AM
Hello all,

By default, a double-click on an expandable tree node causes it to expand/collapse. However, once I introduce an itemclick listener, that event is "swallowed up" by two itemclick events and never runs again, no matter how quick the user clicks. As suggested in other threads, I've looked into using the select instead, but that has different problems for what I'm trying to do; namely, a second click (not a double-click in this case) on the same node doesn't fire the select event because it's already selected, among others. So, if anyone can suggest a way to go about what I am trying to accomplish, I'd appreciate hearing from you.

Each node in our Ext.tree.Panel has a checkbox. We would like an "itemclick" to toggle the checkbox status. We would also like to provide the default itemdblclick functionality noted above. The double-click, however, should not toggle the checkbox status...only expand/collapse the node as appropriate.

Is this easily accomplished in some way I haven't discovered within the Ext.tree.Panel? If not, I was thinking some delay was necessary in the itemclick handler to know whether the event it's dealing with is actually an itemclick or an itemdblclick, but after looking into this for a while, I'm pretty sure that's too complicated for me to implement. If there isn't something here already that I'm just missing, I'm happy to stop beating my head against the wall over it. We're willing to forego the itemdblclick expand/collapse functionality and require the user to use the expand icon instead in order to have the checkbox status toggle on the itemclick. But, just in case there is something I can do, I thought I'd ask in the forums.

Any comments, information or direction in this regard are welcome.

cheers,
jtm

mitchellsimoens
7 Dec 2012, 8:07 AM
I often will save when the last click was done as a property (new Date().getTime() ) and then check that in each click. If it was within so many milliseconds I consider it a double-click

myExtJsUname
7 Dec 2012, 8:33 AM
And then, you will trigger the itemdblclick yourself from within the itemclick handler?

mitchellsimoens
7 Dec 2012, 8:57 AM
You only need 1 listener at that point so just the itemclick event.

myExtJsUname
7 Dec 2012, 9:24 AM
Thank you, Mitchell, for taking the time to respond to my query. I have to be honest, though, and say that I may not be following what you are suggesting. So, if you don't mind, I'd like to go over what I think you are recommending.

I thought you were suggesting that I keep track in the itemclick handler when a given itemclick event occurred and set up some kind of delay so I can see if a second click has occurred within a predefined (small) period of time after which I would determine whether the itemclick or itemdblclick functionality should be invoked. If no second click is received, the code would carry on and perform the itemclick functionality (in my case, toggle the checkbox status) and, if a second click is received, I would cancel the "itemclick" that's waiting and fire an "itemdblclick" on the tree panel that would invoke the default expand/collapse behaviour.

Am I understanding you correctly?

rsqw
18 Sep 2013, 2:06 PM
Here is my solution to fix this:



###
@param {Object} panel
@param {Object} node
###
onNodeClicked: (panel, node) ->
unless node.isLeaf()
return @onNodeItemSingleClick node

delay = 200
eventDate = new Date().getTime()

if eventDate - @nodeClickedTime < delay
# double click
Ext.EventObject.stopEvent()
@onNodeItemDblClick node
clearTimeout @timeout
else
@timeout = Ext.defer =>
@onNodeItemSingleClick node
, delay

@nodeClickedTime = new Date().getTime()