JavaScript / Jquery : how to access a form present inside a iframe from parent window
Question
I have this situation where I have a Parent window ( form name : pform), on click of a button on Parent Window, I display an Iframe to the User. The Iframe is part of the Parent window initially, but there is a facility that Iframe can be Undocked. The Iframe has a separate form. By Undocked I mean the whole iframe is copied into a new window along with the form (Form name : cform).
How can I assess the hidden variables (id="r111.o1" and "r111.o2") in the Iframe from the Parent window.
<form method="post" action="xxx" name="pform" id="pform">
<div>
<div class="iframe">
<iframe>
<form name="cform" id="cform" >
<input type="hidden" value="1" name="r111.o1" id="r111.o1">
<input type="hidden" value="1" name="r111.o2" id="r111.o2">
...
</form>
After the Iframe is undocked,
<form method="post" action="xxx" name="pform" id="pform">
<div>
<div class="iframe">
</form>
<html><div><iframe>
<form name="cform" id="cform" >
<input type="hidden" value="1" name="r111.o1" id="r111.o1">
<input type="hidden" value="1" name="r111.o2" id="r111.o2">
....
how can I still be able to access the hidden variables? Is this possible.??
Update: I have written this JS code which I able to identity the window/iframe in both docked or undocked.
XT.Assess = {};
XT.Assess.windows = new Array(); // creating array to keep track of the child window ( undocked)
XT.Assess.iframes = new Array(); // creating array to keep track of the iframe ( docked)
function validateRub(id) {
var rubWindow = XT.Assess.windows[id];
if( rubWindow ){ // undocked
console.log( 'rubWindow = '+rubWindow );
var rubcont = rubWindow.contentDocument || rubWindow.contentWindow.document;
console.log( 'rubcont = '+rubcont );
var rubIframe = XT.Assess.iframes[id]; // not working
console.log( 'rubrIframe = '+rubrIframe );
}
else { //docked
var rubIframe = XT.Assess.iframes[id];
console.log( 'rubIframe = '+rubIframe );
var ifr = document.getElementById('Iframe0');
console.log( 'ifr= '+ ifr);
var ifrDoc = ifr.contentDocument || ifr.contentWindow.document;
console.log( 'ifrDoc= '+ifrDoc );
var theForm = ifrDoc.getElementById('cform'); // Iframe
console.log( 'theForm= '+theForm );
}
return false;
}
All I need now is a code to iterate through the HTML elements in the object rubIframe and rubWindow . Am I going in the right path? Thanks in advance.
1 answers
solution1
0 2014-09-19 09:07:35
you can use iframe content by using iframe contentwindow element
var iframe = document.getElementById("yourFrameId");
var iframeContent = (iframe.contentWindow || iframe.contentDocument);
and then you can call any functions of that file like
iframeContent.myfunction();
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.