I know, I know, don't use frames. Well, I'm stuck with these frames and
I'm trying to add functionality without a complete redsign. You can
look at this as a nostalgic journey.
Anyway, I've got the following frame structure at the top level:
FRAMESET CODE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html><head><title>Server List</title></head>
<frameset frameborder="1" border="1" framespacing="1" rows="10%,89%">
<frame name="TopFrame"
src="/rob/serverlist.nsf/TopPage?OpenPage"
SCROLLING="No" NORESIZE FRAMEBORDER="No">
<frameset cols="16%,83%">
<frame name="LeftNavFrame"
src="/rob/serverlist.nsf/LeftNavPage?OpenPage&BaseTarget=MainFrame"
SCROLLING="No" NORESIZE FRAMEBORDER="No">
<frameset rows="8%,91%">
<frame name="ViewControls"
src="/rob/serverlist.nsf/by%20Server%20Name?OpenPage&BaseTarget=MainFra me"
SCROLLING="No" NORESIZE FRAMEBORDER="No">
<frame frameborder="0" name="MainFrame"
src="/rob/serverlist.nsf/by%20Server%20Name?OpenView">
</frameset>
</frameset>
</frameset></html>
I'm trying to pickup the value of a JavaScript variable I set in one
frame from another frame. Here's the details.
In frame 'MainFrame' I have this code (it makes use of prototype.js to
fetch field values but that part of the code works. It just can't seems
to find code across frames.):
MAINFRAME CODE FRAGMENT
....snip
<body text="#000000" bgcolor="#E0FFFF" id='viewbody'>
<form action="">
<script>var resort = 'RESORT VALUE HERE';</script>
....snip
END MAINFRAME CODE FRAGMENT
In frame 'ViewControls' I have this code:
VIEWCONTROLS CODE FRAGMENT
....snip
<script>
function getFrame(fName){
var frames = top.document.getElementsByTagName("FRAME");
var frame= null;
for(var i=0; i < frames.length; i++){
if(frames[i].name == fName)
frame = frames[i];
}
var forms = frame.getElementsByTagName("*");
for(var j=0; j < forms.length; j++){
alert("Got form " + j);
}
// for(var n in frame.document.forms[0]){
// alert("Frame val: " + n + " is " +
frame.document.forms[0][n]);
// }
return null;
}
var viewStart = 1;
function openView(increment){
viewStart = parseInt(viewStart) + parseInt(increment);
viewStart = (viewStart < 1) ? 1 : viewStart;
alert("Frame found: " +
getFrame("MainFrame").document.forms[0].resort);
window.open($F('URLtoOpen') + "&Start=" + viewStart + "&Count="
+
$F("Count"), 'MainFrame');
}
</script>
Rows to display:
<input name="Count" value="1000" id="Count" size="4" maxlength="4">
<input type="button" onclick="viewStart=1;openView(0);" value="First
Page">
<input type="button" onclick="openView(-($F('Count')));"
value="<<Previous Page">
<input type="button" onclick="openView($F('Count'));" value="Next
Page>>">
<script>openView(0);</script>
....snip
END VIEWCONTROLS CODE FRAGMENT
So the function openView is called when the ViewControls page loads and
when one of the three buttons is pressed. Right now openView calls
getFrame("MainFrame") in the alert because I'm testing. getFrame
successfuly finds "MainFrame" but there I get stuck.
The DOM still confounds me after reading and working with it (on and
off) for months. I can not figure out what the hierarchy is of the
elements. When I use the DOM inspector in FireFox it shows me that
inside the FRAME with name="MainFrame" is "# document" (what does the #
mean?). I can trace through the children "document->HTML->BODY->FORM'.
Isn't this the form where the variable was created? Yet I can not find
it using the DOM inspector and I've tried everything I can think of in
the code to find it.
Clearly I am confused about the scope of things in the DOM. Can anyone
point me to a book or web site that CLEARLY explains what is where and
why? (Or any other help.)
Thanks in advance,
Rob:-]
