View Full Version : Best Way to Fire Events Into child ExtJs App

28 Jun 2013, 11:36 AM

I have an app consisting of a set of tabs, where the content of each tab is an iFrame with another extjs application running inside.

My approach has been similar to the one in this (http://www.sencha.com/forum/showthread.php?243179-Success-with-Sencha-Architect) thread (but with tabs already there, and without the tree view), and I am using a SimpleIFrame (http://www.sencha.com/forum/showthread.php?214872-A-small-iFrame-Demo-using-Conor-Armstrong-plugin) plugin mentioned in that thread. One thing this plugin allows is for the tab panels to access the DOM of their iFrame content.

What I would like to have is a safeguard between switching tabs - when a tab is switched I want to fire an event that the extjs app inside that tab's iframe can listen for and, if needed, pop up an alert warning the user against switching tabs.

I think the best way to approach this is to get the DOM of the iframe content and fire a custom event into it that the extjs app in the iframe can listen for, but I am not sure. I have made attempts at that without success, and am really wondering if there is a better way.

So, is there a better way to do this? If not, how can I properly fire and listen to events in the DOM?

2 Jul 2013, 2:22 PM
You should have access to your application in the iframe using the iFrame component's getWin() method.
Then you can do something like:

tabIFrame.getWin().<appname>.app.fireEvent('yourevent', arg1, arg2);