I have a aframedpage which have two frames.>
First frame have two iframes and second frame also have two iframes.>
Each iframe have a form to add record. Each forms have some fields to
enter data.
To show the layout of the page, I have created a picture.
Please go through this layout picture at this link:
http://docs.google.com/Doc?id=dff38n8b_0c5nb9bcs
Problem:
=========
I have set the following javascript variables in the <head> tag of
"leftframe.htm" which represents frame "leftframe"
Code:
<script type="text/javascript">
var studentFirstName = "";
var studentLastName = "";
var studentEmailID = "";
var studentScore ="";
var studentCountry="";
var studentEducation="";
var studentSkills="";
var studentHeight="4 Foot 6 Inch.";
var studentWeight="45 Kilogram";
</script>
Now I want to set the value of these variable to the input box (text
box) of these forms in different iframes.
-------------------------------------------------------------------
index.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"
http://www.w3.org/TR/html4/frameset.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
<frameset cols="50%,50%">
<frame name="leftframe" src="leftframe.htm">
<frame name="rightframe" src="rightframe.htm">
</frameset>
</html>
-------------------------------------------------------------------
leftframe.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
<script type="text/javascript">
var studentFirstName="Peter";
var studentLastName="Johnson";
var studentEmailID="";
var studentScore="48";
var studentCountry="USA";
var studentEducation="physics";
var studentSkills="";
var studentHeight="4 Foot 6 Inch.";
var studentWeight="45 Kilogram";
</script>
<script type="text/javascript">
function spreadvars() {
var f1 = frames['leftFirst'].document.forms['userdb'];
f1.elements['fname'].value = studentFirstName;
f1.elements['lname'].value = studentLastName;
f1.elements['emailid'].value = studentEmailID;
var f2 = frames['leftSecond'].document.forms['scoredb'];
f2.elements['emailid'].value = studentEmailID;
f2.elements['score'].value = studentScore;
f2.elements['country'].value = studentCountry;
var f3ref = parent.frames['rightframe'].frames['rightFirst'];
var f3 = f3ref.document.forms['edudb'];
f3.elements['emailid'].value = studentEmailID;
f3.elements['education'].value = studentEducation;
f3.elements['skills'].value = studentSkills;
var f4ref = parent.frames['rightframe'].frames['rightSecond'];
var f4 = f4ref.document.forms['sizedb'];
f4.elements['emailid'].value = studentEmailID;
f4.elements['height'].value = studentHeight;
f4.elements['weight'].value = studentWeight;
}
</script>
</head>
<form method="get" action="#">
<iframe name="leftFirst" src="leftfirst.htm"></iframe><br>
<iframe name="leftSecond" src="leftsecond.htm"></iframe><br>
<input type="button" onClick="spreadvars();"
value="Spread variables over frame/iframe hierarchy">
</form>
</body>
</html>
-------------------------------------------------------------------
rightsecond.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
</head>
<body>
<form method="post" name="sizedb" action="sizedb.php">
<input type="text" name="emailid" value=""><br>
<input type="text" name="height" value=""><br>
<input type="text" name="weight" value=""><br>
<input type="submit">
</form>
</body>
</html>
-------------------------------------------------------------------
leftfirst.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
</head>
<body>
<form method="post" name="userdb" action="userdb.php">
<input type="text" name="fname" value=""><br>
<input type="text" name="lname" value=""><br>
<input type="text" name="emailid" value=""><br>
<input type="submit">
</form>
</body>
</html>
-------------------------------------------------------------------
leftsecond.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
</head>
<body>
<form method="post" name="scoredb" action="scoredb.php">
<input type="text" name="emailid" value=""><br>
<input type="text" name="score" value=""><br>
<input type="text" name="country" value=""><br>
<input type="submit">
</form>
</body>
</html>
-------------------------------------------------------------------
rightfirst.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
</head>
<body>
<form method="post" name="edudb" action="edudb.php">
<input type="text" name="emailid" value="xxx"><br>
<input type="text" name="education" value=""><br>
<input type="text" name="skills" value=""><br>
<input type="submit">
</form>
</body>
</html>
-------------------------------------------------------------------
rightframe.htm
-------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Spread variables over frame/iframe hierarchy</title>
</head>
<body>
<iframe name="rightFirst" src="rightfirst.htm"></iframe><br>
<iframe name="rightSecond" src="rightsecond.htm"></iframe>
</body>
</html>
-------------------------------------------------------------------
I am using a button to spread the variables. If you want the script to
run on page load, it's not guaranteed that all (i-)frames have
finished loading, so each of the four iframes would need to send some
signal that they are available.
Hope this helps,
