Monday, August 9, 2010

Ext 2.2 Prevent GridPanel's rowclick handler to execute on rowdblclick

I had a requirement where I needed to perform different actions on a single click and a double click on a row in a GridPanel. I was using a Ext.grid.GridPanel and handling "rowclick" and "rowdblclick" events. I noticed that even on a double click, the row click event was fired always. I could very well ignore it, but an unnecessary action was being performed.
Here's how I prevented rowclick's action to be performed on a rowdblclick:
I defined a DelayedTask, used it to perform the rowclick action after a little time delay and cancelled the task on rowdblclick.

  var rowClickTask = new Ext.util.DelayedTask();

  var myGrid = new Ext.grid.GridPanel({
    .
    .
    .
    listeners: {
      rowclick : function(){
        rowClickTask.delay(200,singleClickAction,this);
      },
      rowdblclick: function(){
        rowClickTask.cancel();
        doubleClickAction();
      }
    }
  });


This might not be the best way of handling this issue, but it works for me :)

No comments: