Access variables in a iFrame, or Vice Versa

Question

I have a html page with an iFrame, from which i want to read a few variable. Its basically a map, from which i want to retrieve the Latitude and Longitude values.

I've been working on Adobe AIR, and I've tried retrieving values from innerHTML, contentWindow, but still been unable to get this working.

Any good ways to get this done?

Answer 1

You can use jQuery to access content inside an iframe.

<iframe id="iframeId" ...> .... <div id='someData'>data</div> ....</iframe>
$('#iframeId').contents().find('#somedata').html(); // returns data

Answer 2

I tried that out... It dint work... The iframe is loaded with an HTML page in a different domain. Also, its a AIR app i'm working on...

Answer 3

The browser security model prohibits any cross-domain traffic/communication. The rules can be relaxed, if we're dealing with different sub-domains, to the top domain. But ultimately, you have no recourse.

If you have applications needing to talk across domain-boundaries, going via a backend usually is your best bet. If you don't control the content in the iframe you're usually out of luck. FYI, google maps do provide an API for using their application. http://code.google.com/apis/maps/index.html

Answer 4

You have to use the application to non-application sandbox bridge. This will allow you to communicate between the two areas (iframe and general). Take a look here http://www.adobe.com/devnet/air/ajax/quickstart/sandbox_bridge.html

Answer 5

Thanks for the reply guys,

@svend : What exactly is "going via a backend"? I dint get that.. I do control the content in the iFrame, which's on an other domain.

@Webber : Thanks for that link webber... Looks like its gonna work out for me.. I'll try that out...

Answer 6

The application to non-application sandbox bridge worked in case of cross domain communication..

Thanks for the replies guys..

Answer 7

I had to do it this way:

1- Add hidden inputs inside the file that contains the iframe where they save the lng and lat whenever the user changes them.

2- Create this function on js:

function getFrameWindow(frameId) {

var frame = document.getElementById(frameId); var result = null; if (frame.contentDocument) { // For NS6 result = frame.contentDocument.window || frame.contentDocument.defaultView; } else if (frame.contentWindow) { // For IE5.5 and IE6 result = frame.contentWindow; } else if (frame.document) { // For IE5 result = frame.document.window; } return result; }

3- used this code from the javascript that contains the iframe: getFrameWindow("iframe").document.getElementById("lat").value