Question

Ok, I know everyone thinks IFrames are bad an I know that. But I am “required” to use one for a rare case.

So the question I have is when you have an .aspx page that contains an IFrame and then in that IFrame another .aspx page, if you want that .aspx page inside that IFrame to be able to work with JS, should you:

1) Put all your JS in the main .aspx and somehow reference that code from the inner .aspx to the main .aspx to call JS methods that reside in the main .aspx? Meaning should I be thinking about this backwards in that I put all JS even if it’s really for the inner .aspx in the main .aspx and then try to make calls from that inner .aspx and reference those JS methods somehow? Because right now I’m having trouble grabbing the ClientID for .aspx controls when I have JS inside the inner .aspx and that .aspx also has asp.net web controls that I’m trying to set a JS var to its clientID..normal stuff here but it’s not working because every time I test that var in JS it’s just spitting back the server-side ID, not the runtime rewritten ID that the naming container in the control spits out.

I also see the problem in that you’d have to somehow get the jQuery library if using a library like this somehow referenced to your .aspx that sits in the IFrame. You wouldn’t want to load the jQuery library twice (once in your main and once in your Iframe’s .aspx) so that further makes me tend to believe that this option is how I need to go so that the inner .aspx somehow references the main .aspx’s reference to the jQuery library that I’ve included in my master page. The main .aspx is tied to that master page.

2) Put the main .aspx related JS of course in the main .aspx and put the inner .aspx related JS in the inner .aspx file. But then again I run into problems as stated.

This is a lot to read but I don’t know how else to explain this problem and situation where I’m trying to figure out what people are doing about this when using IFrames.

Answer 1

You can reference anything in your main page from any iframe by using top, as in top.getElementById('maindiv');

From the main page, you access the frame by its name or index from the frames array.

Both frame and parent must be vended from the same domain to cross-communicate in this way.