Access elements of parent window from iframe

Question

I have a page we can call parent php  In this page I have an iframe with a submit form and outside of that I have a div with the id  target   Is it possible to submit the form in the iframe and when success refresh the target div  Say load a new page into it or something   Edit  The target div is in the parent page  so my question is basically if you can make for an example a jQuery call outside the iframe to the parent  And how that would look   Edit 2  So this is how my jquery code looks like now  It is in the  of the iframe page  the div  target is in the parent php      form name my form    submit function e         e preventDefault    window parent document getElementById   target          target   load  mypage php   function          form name my form    submit                 I don t know if the script is active cause the form submits successfully but nothing happens to target   Edit 3   Now I m trying to call the parent page from a link within the iframe  And no success there either    lt a href  javascript window parent getElementById   target   load  mypage php     gt Link lt  a gt

User · Answer

You can access elements of parent window from within an iframe by using window.parent like this:

// using jquery    
window.parent.$("#element_id");

Which is the same as:

// pure javascript
window.parent.document.getElementById("element_id");

And if you have more than one nested iframes and you want to access the topmost iframe, then you can use window.top like this:

// using jquery
window.top.$("#element_id");

Which is the same as:

// pure javascript
window.top.document.getElementById("element_id");

User · Answer

I think you can just use window parent from the iframe   window parent returns the window object of the parent page  so you could do something like   window parent document getElementById  yourdiv      Then do whatever you want with that div

User · Answer

Have the below js inside the iframe and use ajax to submit the form     function           form   submit e           e preventDefault              Use ajax to submit the form          ajax             url  this action            data    this  serialize              success  function                 window parent     target   load  urlOfThePageToLoad

User · Answer

I think the problem may be that you are not finding your element because of the     in your call to get it   window parent document getElementById   target       You only need the   if you are using jquery  Here it should be   window parent document getElementById  target

[javascript] Access elements of parent window from iframe

Examples related to javascript

Examples related to jquery

Examples related to ajax

Examples related to iframe