Flex: IFrame comms demo update

IFrameCommTest is an updated version of my original Flex/HTML communications demo.

I have modified it to be standalone so you no longer need to deploy it on a Web Server to work.

To recap:

Data is passed to the page using a Flex Event. The page registers an event handler through FABridge for the DirectionEvent. When the application creates and dispatches the event it is received along with the attached data. Note how FABridge creates the getter functions from the public member variable names ‘toValue’ and ‘fromValue’.

Data is received from the page by calling a function defined in the application from the javascript. Note that the IFrame has to be hidden when the alert box is displayed otherwise it cannot receive focus to close (try it out by commenting out the line to reset the visibility).

The demo is here. Right click to see the source code.

Full zipped project here.


10 Responses to “Flex: IFrame comms demo update”

  1. Dave McRoberts on February 1st, 2008 7:22 pm

    When I run the Demo App locally, I get a javascript error on line 14: ‘this.parent.FABridge’ is null or not an object. I am opening the IFrameCommTest.html in the bin directory when hosted on local IIs server. I get the sandbox error when opening on the filesystem.

  2. Administrator on February 3rd, 2008 7:34 pm

    Oops, sorry. I forgot to bundle the FABridge.js file under html-template. I have updated the zip file. Try it now.

  3. Raed Atoui on February 11th, 2008 3:58 am

    Hi. This is the best HTML solution i have ever seen around. Thank you for making this available. I am using this in building website whose content is determined by local HTML files. Allowing the communication between HTML and flex to be so easy is allowing me to dispatch event so easily, and improving the user interaction. html links click 10 times better than links in a htmltext of a textArea. anway, cheers man!

  4. Raed Atoui on February 11th, 2008 3:59 am

    PS: the point of having local html files manage the content is an excellent way for clients that know some html to add customization to their content!!!

  5. Brice Gervais on April 16th, 2008 7:58 am

    Hi. Thank you very much for this iframe comms demo update. I would like to understand why comm is not working on safari 3 for windows. Thank you for your answer.

  6. Administrator on April 16th, 2008 10:34 pm

    Brice, The comms demos use an Adobe component called FABridge (Flex Ajax bridge). This does not work under Safari 3, Opera and there may be issues with IE7.

    The basic IFrame component function of displaying html page works because it sticks to the simpler ‘ExternalInterface’ type of calls down into the html IFrame holder page.

    I do not think you will be able to form two way communication between the html/javascript page and the Flex app in such an easy way without FABridge.

    Do I think it’s possible? Maybe. A web search to see if someone has tried registering callbacks using ExternalInterface into the Flex from the javascript (although I’m not saying this is possible).

  7. Chandrashekhar on April 21st, 2008 8:25 am

    Hi ,

    I’m new in flex ,
    want to develop html editor in Flex 3.0.

    Anybody guide me for same…
    provide ref links if you have..

    Thanks in Advance

  8. Administrator on April 21st, 2008 9:01 am

    Chandrashekhar, You could certainly host an html editor component using the IFrame and this technique (provided you accept it’s limitations).


  9. lemlich on September 29th, 2010 10:43 pm

    This works for me in IE8 and Firefox, but it does not work in Chrome, even with popups allowed. The old version didn’t work in Chrome either. I read something elsewhere that makes me think FABridge isn’t supported in Chrome. Am I right?


  10. Administrator on October 14th, 2010 10:57 pm

    Yeah I am pretty sure FABridge isn’t supported under Chrome.

Leave a Reply