Solved

Call a function in an iframe from the parent page

Posted on 2006-10-23
8
2,550 Views
Last Modified: 2010-04-07
Experts, I have several iframes on a page and need to call to a function IN the iframe FROM the parent "top" page. How would I go about this?

~ C
0
Comment
Question by:clickclickbang
  • 3
  • 2
  • 2
  • +1
8 Comments
 
LVL 54

Assisted Solution

by:b0lsc0tt
b0lsc0tt earned 200 total points
ID: 17792365
clickclickbang,

Simple.  Use something like the following.

parent.functionname();

Let me know if you have any questions or need more information.

b0lsc0tt
0
 
LVL 14

Expert Comment

by:RichieHindle
ID: 17792372
Main HTML (main.html):

<html>
<body>
<button onclick='document.frames.myframe.myfunction()'>Click me</button>
<iframe name='myframe' src='iframe.html' width='200' height='200'>
</body>
</html>

Frame HTML (iframe.html):

<html>
<head>
<script type='text/javascript'>
function myfunction() {
    window.alert("Hello");
}
</script>
</head>
<body>
<p>This is the iframe.</p>
</body>
</html>

0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 17792375
Let me know if there is some issue for some reason or if you need details.  That is in html in the iframe calling a function in the parent's html.  Let me know if I misunderstood what you need.

bol
0
 
LVL 14

Expert Comment

by:RichieHindle
ID: 17792396
Oops!  document.frames doesn't work in Firefox.  Here's the correct main.html:

<html>
<body>
<button onclick='window.frames.myframe.myfunction()'>Click me</button>
<iframe name='myframe' src='ee-iframe-2.html' width='200' height='200'>
</body>
</html>
0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 1

Author Comment

by:clickclickbang
ID: 17792760
RichieHindle is on the right track. I need the parent to call a function in the child frame. However, how would I go about this with a dynamic ID for the frame? Also, would there be a way to verify the function exists before calling it to avoid an object not found error?

Thanks guys!
0
 
LVL 26

Assisted Solution

by:DireOrbAnt
DireOrbAnt earned 50 total points
ID: 17793293
If the FRAME/IFRAME got an ID="MyFrameID", then something like:
var MyFrame = document.getElementById('MyFrameID');
if (MyFrame.MyFunction) MyFrame.MyFunction();
0
 
LVL 14

Accepted Solution

by:
RichieHindle earned 250 total points
ID: 17794025
Here you go; this main.html lets you enter the name of the frame and the name of the function, and gives you an error if either isn't there:

<html>
<head>
<script type='text/javascript'>
function go(frame_name, function_name) {
    var iframe = window.frames[frame_name];
    if (!iframe) {
        window.alert("There's no frame called '"+frame_name);
        return;
    }
   
    if (typeof(iframe[function_name]) == 'undefined') {
        window.alert("There's no function called '"+function_name);
        return;
    }
   
    iframe[function_name]();
    return false;
}
</script>
<body>
<form>
Enter the frame name ('myframe'): <input type='text' name='frame_name' size='12' value='myframe'><br>
Enter the function name ('myfunction'): <input type='text' name='function_name' size='12' value='myfunction'><br>
<button onclick='go(document.forms[0].frame_name.value, document.forms[0].function_name.value)'>Click me</button><br>
<iframe name='myframe' src='ee-iframe-2.html' width='200' height='200'>
</form>
</body>
</html>
0
 
LVL 1

Author Comment

by:clickclickbang
ID: 17796136
Thanks guys! I'll give it a shot!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today I would like to talk about localizing (Internationalization) JavaScript applications. Introduction When creating an application that is going to be used by many people around the globe, it is important to remember that not everyone speak…
When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now