ExtJS/Script# - Adding a double-click event to a button

Question

Creating a calculator-like dialog, I noticed that quickly clicking on a button in IE will not fire the click event twice (Chrome/FF work as expected), but rather throws the click event, then a double-click event. Experimenting with some simple code, I essentially want to duplicate this behavior:

<script language=javascript>
function minus(num)
{
  var i = document.getElementById('0001');
  if (i.value > 1)
  {
    i.value -= num;
    return true;
  }
}
</script>

<input type="button" onclick="minus(1);"  ondblclick="minus(1);" value="minus">
<input type="text" id="0001" name="0001" value=10>

I need to do this in ExtJS 3.1, but my efforts have been stymied. Here is the code I have tried:

Button btn = new Ext.Button(new ButtonConfig()
                            .text(text)
            .tooltip(tooltip)
                            .tooltipType("title")
                            .scope(this)
                            .handler(delgateFunction)
                            .x(x)
                            .y(y)
                            .tabIndex(_tabIndex++)
                            .width(width).height(height)
                            .ToDictionary());
btn.addListener("mouseenter", new EventHandler(mouseHandler));
btn.addListener("mouseover", new EventHandler(mouseHandler));
btn.addListener("mouseout", new EventHandler(mouseLeave));
if (Ext.isIE)
{
  //btn.on("dblclick", new EventHandler(DoubleClick));
  //btn.addListener("dblclick", new EventHandler(DoubleClick));
  //btn.addListener("ondblclick", new EventHandler(DoubleClick));
}

None of those three lines seemed to work. Any suggestions?

Answer 1

Mr. Zhu led me to the correct answer:

Events.AddEvent(_zeroBtn.getEl().dom, "dblclick", DoubleClickZero);

Answer 2

try the following after the button is rendered:

btn.el.on("dblclick", new EventHandler(DoubleClick));

Ext.Button itself hasn't the "dblclick" event (check the api) while its underlying el(Ext.Element) has.

Complete Sample:

new Ext.Button({id:'btn', text:'dblclick', renderTo:Ext.getBody() });
Ext.getCmp('btn').el.on('dblclick', function(){alert('db click');});