Forum Moderators: open
I have links in the "leftpage" that I need to control anchor positions of the "rightpage" (without reloading the document).
Using javascript I can send a message from the "leftpage" to a function in the "rightpage" giving the required anchor name as an arguement. However, when the function activates to set the anchor position the "lefthand" page appears in the right hand position.
function goanchor(anchorname) {
alert(window.location.href); //correctly indicates its the "righthand" page
window.location.href=anchorname;
}
I've tried:
top.window.frames[1][1].location.href +anchorname;
instead of:
window.location.href=anchorname;
but this still brings up the "leftpage" in the right hand fram.
Where am I going wrong?
top.rightpage.location.href = 'pagename.htm#' +anchorname;
I tried
top.rightpage.location.href = 'pagename.htm#' +anchorname;
but nothing happened
Then I tried:
parent.rightpage.location.href = 'pagename.htm#' +anchorname;
This takes me to the anchor but rewrites the page first plus it rewrites the left hand frame displaying just the URL
No. I think it has to be done by sending a message to a function in the right hand page but how exactly to do this I don't know.
<a href="#" onclick="parent.rightpage.location.href = parent.rightpage.location.href + '#content'; return false;">Test Link</a>You can also call a function in the rightpage if you want, but it is more code...but it may be worth it if you have alot of links in leftpage:
Leftpage:
<a href="#" onclick="parent.rightpage.goanchor('content'); return false;">Test Link</a>Rightpage:
<script type="text/javascript">
<!--
function goanchor(anchorname) {
window.location.href = window.location.href +
"#" + anchorname;
}
//-->
</script>
HTH
Jordan
It seems as if this method will refresh the document in the right hand frame.
The problem is that in this right hand frame there is a form and I want to be able to move up and down this form without removing any of the entries that have been made.
I can obviouly do this if I use location.href="#" +anchorname in the document containing the form, but I want to be able to do it from another document in the left hand frame.
It's probably something quite simple, but I can't figure out how to do it.
In the first case just appending "#anchorname" to the rightpage.location.href will work -- ONCE -- but then every other time it won't work. Check the URL and we can see why:
First url:
[some.where...]
After first click:
[some.where...]
After second:
[some.where...]
Doh!
In the second case, when a function is called from a different window the function takes the context of the calling window, as if it was actually part of that window. That means that it wouldn't work as I expected.
But I came up with a (tested) solution that seems to work in all the browsers I've tested in (Moz / Op7 / IE6).
Frameset.htm <?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"XHTML1-f.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en" >
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Testing...</title>
<script type="text/javascript">
<!--
function getSelf(side) {
var idx = -1;
var mySelf = null;
if ((side) && (side == "right")) {
idx = rpage.location.href.indexOf("#");
if (idx > -1) {
mySelf = rpage.location.href.substring(0, idx);
}
else {
mySelf = rpage.location.href;
}
}
else if ((side) && (side == "left")) {
idx = lpage.location.href.indexOf("#");
if (idx > -1) {
mySelf = lpage.location.href.substring(0, idx);
}
else {
mySelf = lpage.location.href;
}
}
return mySelf;
}
function goAnchor(anc, page) {
var mySelf;
var side = null;
if ((page) && (page == "r")) {
side = "right";
}
else if ((page) && (page == "l")) {
side = "left";
}
mySelf = getSelf(side);
if (anc.indexOf("#") > -1) {
mySelf += anc;
}
else {
mySelf += ("#" + anc);
}
if (side == "right") {
rpage.location.href = mySelf;
}
else {
lpage.location.href = mySelf;
}
}
//-->
</script>
</head>
<frameset cols="150,*" name="frame1" id="frame1"
frameborder="2" border="0" framespacing="0">
<frame name="lpage" src="Frame1.htm"
marginwidth="8" marginheight="8"
scrolling="auto" />
<frame name="rpage" src="Frame2.htm"
marginwidth="10" marginheight="10"
scrolling="auto" />
<noframes>
<body>
<div>Your web-browser is too old support
frames!</div>
<div>You probably still drive a gremlin and
listen to K.C. and the Sunshine Band, as well.</div>
</body>
</noframes>
</frameset>
</html>
Frame1.htm <?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en" >
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Title</title>
</head>
<body>
<h1>Testing</h1>
<div class="text">
<div><a href="#"
onclick="parent.goAnchor('test1', 'r');
return false;">Test 1 Link (function)</a>
</div>
<div><a href="#"
onclick="parent.goAnchor('test2', 'r');
return false;">Test 2 Link (function)</a>
</div>
<div><a href="#"
onclick="parent.goAnchor('main', 'r');
return false;">Main (function)</a></div>
<div><a href="#"
onclick="alert(parent.rpage.location.href);
return false;">rpage location</a></div>
</div>
</body>
</html>
Frame2.htm <?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en" >
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Title</title>
</head>
<body>
<div id="main">
Lots of line-breaks so we can see the srolling better...
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br />
<div id="test1">
I'm #test1
</div>
<div id="test2">
I'm #test2
</div>
<a href="#"
onclick="parent.goAnchor('main', 'r'); return false;">
Up To Top</a>
</div>
</body>
</html>
Jordan
That works a treat. I added a form to Frame2.htm (the right hand frame). The links in the left hand frame allowed me to scroll around this form without any refresh deleting any entries. Brilliant!
I now have to go through your code in detail to see exactly how you are doing this so that I can adapt it for the agent system on my web site.
peter
