Ext.button click() method

Question

ExtJS 4.1.

Is there something like Ext.button.click(); method on Ext.button class?

Is it possible to programmically "click" a button with one method?

Sorry if its a stupid question, but are you sure you're using ExtJS 1.1? It's just that ExtJS 2 is not supported for long time now, so it seems odd you're using 1.1; — Izhaki, Aug 11 '12 at 13:03
Cannot believe such a popular event is not part of this framework! Ended up with awkward `button.getEl().dom.click()` — Geo, Jun 06 '13 at 15:57

score 25 · Accepted Answer · answered Aug 13 '12 at 06:51

25

Or if you have an MVC structure you can fire the click event of the button, and if you're listening to the event in your controller and have an associated function it will get called.

button.fireEvent('click', button);

answered Aug 13 '12 at 06:51

Johan Haest

4,391
28
37

1

When you are using handler instead of click listener, you won't be able to fireEvent('click') on this component, event won't execute. So the best way is not to use handler, but use click listener + `button.fireEvent('click');` to simulate `clicking`. – s.webbandit Aug 13 '12 at 06:52
That's right. It's always 'cleaner' to use listeners in my opinion. – Johan Haest Sep 19 '12 at 06:34
2

Just an FYI this does not trigger the handler method for some reason. If that handler method is part of the button config. – dbrin Oct 08 '12 at 21:14
is the click event still raised when the button is disabled? Because it would force you to test the disabled property to launch the associated function... – Guid Jun 18 '13 at 13:54
It will still get fired yes. – Johan Haest Jun 19 '13 at 17:11
thanks s.webbandit..this is the reason why fireclick was not working as most of people using handler instead of listener. – Dev G Jan 31 '14 at 03:38
If you're using `handler` instead of a `click` event, you can use `button.handler()`. – reergymerej Aug 28 '14 at 19:37
@dbrin The handler is not firing when the event listener is registered for click event, because it is vetoed according to ExtJS API doc. "click ( this, e, eOpts ) Fires when this button is clicked, before the configured handler is invoked. Execution of the handler may be vetoed by returning false to this event." – G 1 Apr 23 '20 at 00:39

score 11 · Answer 2 · answered Aug 11 '12 at 13:22

11

The last answer on this forum might give you more insight on how you can do that here they are-

1)Create the event code in a function and call the function from both sides: btn.on("clic", ...) and from the code you want to simulate the click.

2)Use: btnView.btnEl.dom.click();

from - http://www.sencha.com/forum/showthread.php?37772-Solved-Programmatically-click-an-Ext.Button

answered Aug 11 '12 at 13:22

MimiEAM

2,505
1
26
28

Don't think your linked sencha forum thread is actual (2008 year). But the idea about calling `click()` on DOM element is nice! – s.webbandit Aug 12 '12 at 12:57
What is `dom.click();` ? Where eas it tken from? – s.webbandit Aug 13 '12 at 06:04
@s.webbandit it is one of the base web api event: https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event – Sergey Bogdanov Jan 20 '23 at 15:20

score 6 · Answer 3 · answered Jul 11 '13 at 19:56

6

ExtJS 4.2.1

Ext.get('component-id-of-extjs-button').el.dom.click();
Ext.get('toggle-button2').el.dom.click();

works for me.

answered Jul 11 '13 at 19:56

yzorg

4,224
3
39
57

score 2 · Answer 4 · answered Jun 29 '13 at 09:16

In case of buttons using handler, you can directly call the function of button.

Considering button is an Ext JS component, you can use:

   button.handler(button);

or if you want to reach a function of event 'click':

   button.listeners.click(button);

That would also work to call different button events.

score 2 · Answer 5 · answered Jul 31 '15 at 08:06

Since I needed it for many buttons, it was easier to implement an override on the button class, which adds a click function:

Ext.define('Ext.override.Button',{
    override:'Ext.button.Button',
    click:function() {
        this.getEl().dom.click();
    }
})

After this override has been added to the code base, the following works like a charm:

Ext.getCmp("MyButton").click()

Unlike fireEvent or fireHandler, this will work with all kinds of buttons - no matter whether they have a click event or a handler, or whether they are toggle buttons where the clicked button has to be marked as pressed also.

score 1 · Answer 6 · answered Jul 10 '14 at 20:11

1

If you need to execute the "handler" of the button, just run this (tested with ExtJS 4.2)

button.fireHandler()

answered Jul 10 '14 at 20:11

estemendoza

3,023
5
31
51

score 0 · Answer 7 · answered Aug 11 '12 at 18:25

0

If you want to do this in your test scripts, take a look at my Ext.ux.Test library. If you need it for something other, I would suggest reconsidering your approach.

answered Aug 11 '12 at 18:25

Alex Tokarev

4,821
1
20
30

score 0 · Answer 8 · answered Jun 08 '15 at 06:38

0

None of the other answers worked for me, but i found something simplier i think :

var button=Ext.get('the_id_div');
button.dom.click();

answered Jun 08 '15 at 06:38

Vindic

627
6
8

score 0 · Answer 9 · answered Oct 22 '16 at 11:25

0

 document.getElementById("someButtonId").click();

answered Oct 22 '16 at 11:25

Niranjan

1,776
1
13
21

Ext.button click() method

9 Answers9