PDA

View Full Version : calling a function in a nested frame from another frame.


hybridsun
03-07-2003, 03:37 PM
I have a frameset with three frames and I want to call a function called moveDiv that exists in the mainFrame from the topFrame

the frameset is built like this

______________________________
| ---------------------------------------------------|
| topFrame |
| ---------------------------------------------------|
| ---------------------------------------------------|
| l | ` |
| e | ` |
| f | mainFrame ` |
| t | ` |
______________________________


The left and mainFrames are nested. What I need to do is call a function from the top frame that exists in the mainFrame.

I have tried this code:

<a href="javascript:parent.MainFrame.moveDiv()">

But it has become aparent to me through some other testing that my problem is not my script but how Im targeting the nested frame. Matt or anyone listening do you know how to target a nested frame?

Thanks in advance

Mr J
03-07-2003, 09:06 PM
Not sure if I understand the layout of your frames.

Can you list the names of all frames


IE

Frameset 1 names

Nested frame names

hybridsun
03-07-2003, 09:42 PM
<html>
<head>
<title>Help Me !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<frameset rows="110,*" cols="*" frameborder="NO" border="0" framespacing="0">
<frame name="topFrame" scrolling="NO" noresize src="top.htm" >
<frameset cols="108,*" frameborder="NO" border="0" framespacing="0">
<frame name="leftFrame" noresize scrolling="NO" src="nav.htm">
<frame name="mainFrame" src="rec.htm">
</frameset>
</frameset>
<noframes>
<body bgcolor="#FFFFFF" text="#000000">
</body>
</noframes>
</html>

cheesebagpipe
03-07-2003, 10:26 PM
Typo?

<frame name="mainFrame" src="rec.htm">
....
<a href="javascript:parent.MainFrame.moveDiv()">

Try:

top.frames[1].mainFrame.moveDiv()

http://www.oreillynet.com/pub/a/javascript/excerpt/jstdg_ch13/index.html?page=7#jsintwin

requestcode
03-07-2003, 10:30 PM
I'm guessing here, but maybe this:
parent.topFrame.parent.mainFrame.moveDiv()

requestcode
03-07-2003, 10:39 PM
I did some testing and my last answer is wrong. The format you are using is correct so there must be something else wrong. Do you have a link to your page so we can see the code.

Mr J
03-07-2003, 10:52 PM
Tried your frameset

parent.mainFrame.moveDiv()

worked.

Make sure you have not made a typo somewhere and that you haven't used lowercase where uppercase has been used

hybridsun
03-08-2003, 04:08 AM
Here's a link to see whats going on


http://www.designlevel2.com/movediv/index.htm

Mr J
03-08-2003, 02:23 PM
Sorry but there are some things wrong with your scripts

You have called your frame "MainFrame" and are trying to target "mainFrame"

Note the capital "M"

So "MainFrame" and "mainFrame" are not the same

Javascript is case sensitive.

The following should give you more of an incite into moving layers with various browsers.


<SCRIPT language="JavaScript">
<!--
function moveLayerTo(layerID, newX, newY) { // moves layer directly to a new position
if (document.getElementById) {
document.getElementById(layerID).style.left = newX
document.getElementById(layerID).style.top = newY
} else

if (document.layers) {
document.layers[layerID].moveTo(newX, newY)
} else

if (document.all) {
document.all[layerID].style.pixelLeft = newX
document.all[layerID].style.pixelTop = newY
}
}

function moveLayerBy(layerID, xOffset, yOffset) {// moves layer by the specified X-offset and Y-offset
if (document.getElementById && navigator.userAgent.indexOf("Opera 4") != -1) {// Move by not supported in Opera 4
} else

if (document.getElementById) {
var myLayer = document.getElementById(layerID)
myLayer.style.left = parseInt(myLayer.style.left) + xOffset
myLayer.style.top = parseInt(myLayer.style.top) + yOffset
} else

if (document.layers) {
document.layers[layerID].moveBy(xOffset, yOffset)
} else

if (document.all) {
var myLayer = document.all[layerID]
myLayer.style.pixelLeft = parseInt(myLayer.style.pixelLeft) + xOffset
myLayer.style.pixelTop = parseInt(myLayer.style.pixelTop) + yOffset
}
}
//-->
</SCRIPT>

<DIV id=oDIV1 style="position:absolute; left:520px; top:200px; width:130px; height:100px; background-color:#DDDDDD">
Moving Layer oDIV1
</DIV>


<FORM>
<INPUT onclick="moveLayerTo('oDIV1',0,0)" type=button value="Move to 0,0">
<INPUT onclick="moveLayerTo('oDIV1',260,120)" type=button value="Move to 260,120">
<INPUT onclick="moveLayerBy('oDIV1',25,25)" type=button value="Move top & left by 25 ">
<INPUT onclick="moveLayerBy('oDIV1', -30,-30)" type=button value="Move top & left by -30 ">
</FORM>

hybridsun
03-08-2003, 09:17 PM
The name of my frame is "mainFrame"

Im not sure I follow.

cheesebagpipe
03-08-2003, 10:39 PM
Maybe if people weren't so quick to pile on here, it might be easier for posters to follow a line of reasoning. hybridsun: please re-read my original post carefully.

cheers, cbp

Mr J
03-08-2003, 11:16 PM
RE: The name of my frame is "mainFrame"


Yes...your frame is called "mainFrame"

But you are targeting

onClick="parent.MainFrame.moveDiv()

You have spelt mainframe with a capital M in the onclick event

javascript is case sensitive so

"mainFrame" is not the same as "MainFrame"

so it should be

onClick="parent.mainFrame.moveDiv()

No capital M

hybridsun
03-10-2003, 12:19 AM
Thanks everyone I got it! what a releif.

omar:o