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?
9 Answers
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);
8 Comments
s.webbandit
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.
Johan Haest
That's right. It's always 'cleaner' to use listeners in my opinion.
dbrin
Just an FYI this does not trigger the handler method for some reason. If that handler method is part of the button config.
Guid
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...
Johan Haest
It will still get fired yes.
|
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
3 Comments
s.webbandit
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
What is
dom.click(); ? Where eas it tken from?
Sergey Bogdanov
@s.webbandit it is one of the base web api event: developer.mozilla.org/en-US/docs/Web/API/Element/click_event
ExtJS 4.2.1
Ext.get('component-id-of-extjs-button').el.dom.click();
Ext.get('toggle-button2').el.dom.click();
works for me.
Comments
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.
Comments
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.
Comments
If you need to execute the "handler" of the button, just run this (tested with ExtJS 4.2)
button.fireHandler()
Comments
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.
Comments
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();
Comments
document.getElementById("someButtonId").click();
button.getEl().dom.click()