writing to an iframe instead of a frameset

**charco** · 03-27-2006, 06:46 PM

Hi there - I have a script that sends content to a frame in a frameset but would like to use iframe to have it send the content to an inline frame. The javascript writes to the parent frame but I don't know how to get it to write to the iframe - can anyone help?

an example html from the second frame of the frameset is as follows

<html>
<head><title>The Ideal Gas Equation</title>
<script>
//updated 9/7/98 added show answer
//globals
attempts=0
total=0
correct=0
tried=0
theanswer=0
function fresh(){
document.forms[0].second.value=""
attempts=0
}
function clear(){
fresh()
document.forms[1].first.value=""
document.forms[1].second.value=0
document.forms[1].third.value=0
}

function MakeArray(n){
this.length=n
for (var i=1;i<=n;i++){
this[i]= 0}
}
function question(p1,p2,p3,p4,p5){
this.p1=p1
this.p2=p2
this.p3=p3
this.p4=p4
this.p5=p5
}
quest=new MakeArray(10)
quest[1]=new question("What would the volume in "," be of an ideal gas, if a "," mole<br>sample had temperature of "," at a pressure of "," ?")
quest[2]=new question("How many moles of an ideal gas are in a volume of ","<br>with a temperature of "," and a pressure of "," ?","")
quest[3]=new question("What would the pressure in "," be of an ideal gas, if a "," mole<br>sample occupied a volume of "," at a temperature of "," ?")
quest[4]=new question("What would the temperature in "," be of an ideal gas, if a "," mole<br>sample occupied a volume of "," at a pressure of "," ?")

function begin(){
fresh()
total++
document.forms[1].first.value=""
document.forms[1].second.value=total
tried=0
//first calulate P,V,n
var P=Math.round(100*Math.pow(10,Math.random()))/100
var V=Math.round(100*Math.pow(10,Math.random()))/100
var n=Math.round(1000*Math.random())/1000
//use the ideal gas equation to calculate T
var T=(P*V)/(n*.0821)
T=Math.round(100*T)/100
//now pass these variables to the display function
display(P,V,n,T)
}
function display(P,V,n,T){
if (Math.random()>.5){
P=Math.round(760*P)
dimp="torr"}
else{dimp="atm"}
if (Math.random()>.5){
V=Math.round(1e3*V)
dimv="mL"}
else{dimv="liters"}
if (Math.random()>.5){
T=Math.round(T-273)
dimt="ºC"}
else{dimt="K"}
dimn="moles"
//now choose the question
var h=Math.round(.5+4*Math.random())
if(h==1){
v1=dimv
v2=n
v3=T+dimt
v4=P+dimp
theanswer=V
}
if(h==2){
v1=V+dimv
v2=T+dimt
v3=P+dimp
v4=""
theanswer=n
}
if(h==3){
v1=dimp
v2=n
v3=V+dimv
v4=T+dimt
theanswer=P
}
if(h==4){
v1="degrees "+dimt
v2=n
v3=V+dimv
v4=P+dimp
theanswer=T
}
//now compose the question
question=quest[h]["p1"]+v1+quest[h]["p2"]+v2+quest[h]["p3"]+v3+quest[h]["p4"]+v4+quest[h]["p5"]
tryit(question)
}
function tryit(question) {
parent.frame[0].document.clear();
parent.frame[0].document.open();
parent.frame[0].document.writeln ("<html>");
parent.frame[0].document.writeln ("<head>");
parent.frame[0].document.writeln ("</head>");
parent.frame[0].document.writeln ("<body bgcolor = FFFFFF >");
parent.frame[0].document.writeln ("<FONT face = Arial >");
parent.frame[0].document.writeln ("<FONT size = 2 >");
parent.frame[0].document.write (question);
parent.frame[0].document.writeln ("</font>");
parent.frame[0].document.close();
document.forms[0].second.focus()
document.forms[0].second.select()
}
function answer(){
attempts++
if(tried==2){
total++
document.forms[1].second.value=total}
if (document.forms[0].second.value>.95*theanswer &
document.forms[0].second.value<1.05*theanswer ){
correct++
document.forms[1].first.value="correct"
document.forms[1].third.value=correct}
else {document.forms[1].elements[0].value="incorrect"
tried=2}
}
function showans(){
if(attempts>=3){
document.forms[0].second.value=theanswer
}
}
</script>
</head>
<body onLoad="clear()">

<IFRAME NAME="frame">
</IFRAME>

<h2>The Ideal Gas Equation</h2>
This is an exercise in using the Ideal Gas Equation. When you press "New Question", question will appear in the top frame. Determine the value of the answer, enter it in the cell and press "Check Answer." Results appear in the second table. Being careful about the dimensions, calculate the value of the answer and place it in the cell.
Then, press "Check Answer" and the results will appear in the second table.
<ul>
<li>If you miss a problem three times, pressing "Show Answer" will cause the correct answer to appear.
</ul>
<form>

<div align="center"><input type="button" value="New Question" onClick="begin()"><br><br></div>

<div align="center">Enter your answer here:     <input type="text" name="second" size=10></div><br><br>

<div align="center">
<input type="button" value="Check Answer" onClick="answer()" name="button">
    
<input type="button" value="Show Answer" onClick="showans()"></div>
</form>
<form>
<div align="center"><table border=2 bgcolor="#F4F8B6">
<tr>
<td><b>Results</b></td>
<td><b>Total Done</b></td>
<td><b>Total Correct</b></td></tr>

<tr>
<td align=center><input type="text" name="first" size=10></td>
<td align=center><input type="text" name="second" size=3></td>
<td align=center><input type="text" name="third" size=3></td>
<tr>
</table></div>
</form>

</body>
</html>

**jscheuer1** · 03-27-2006, 07:22 PM

You don't actually write to an iframe in that manner. If you are abandoning the frame idea, better to create a division and write to its innerHTML instead. The way this is done is to compile your string and then write it to the object's innerHTML:

Code:

var displayHTML=''
dispalyHTML+='some stuff'
dispalyHTML+=someStringVariable
displayHTML+='some more stuff'
document.getElementById('displayarea').innerHTML=displayHTML

You can have as many lines like:

Code:

dispalyHTML+='some stuff'

as you need and they can contain html tags.

This code, when executed (preferable from a function) will write to an element, say - a division with the designated id (as long as it is a unique id):

HTML Code:

<div id="displayarea"></div>

You can style your division's width and height (and almost anything about it) and even give it scrollbars in case the content won't fit exactly:

HTML Code:

<div id="displayarea" style="width:275px;height:200px;oveflow:auto;"></div>

**charco** · 03-28-2006, 12:34 PM

Thanks - worked great - help much appreciated

Thread: writing to an iframe instead of a frameset

Thread Tools

Search Thread

writing to an iframe instead of a frameset

Bookmarks

Bookmarks

Posting Permissions