[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 201
  • Last Modified:

> link in one frame changing the contents of two frames<

Hi

I have a frameset with two frames [A & B] and would like a link in FRAMEA to load a page into FRAMEB - easy - and also load a new page into FRAMEA at the same time.

can someone help?

Cheers

Charlie
0
cmuir
Asked:
cmuir
1 Solution
 
mvan01Commented:
Link in FRAMEA:

<a href="page_for_b.htm" target=FRAMEB onClick="javascript:self.location.href='page_for_a.htm';">load both</a>

... or something like that?  self.location.href is prob'ly not the right words.

Peace and joy.  mvan
0
 
radnorCommented:
Not sure if it will work exactly for you but I did this a long time ago.....   This had one frame across the top with links in it and 2 under it (left & Right).  Click a link in the nav and BOTH frames updated....



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<script language="JavaScript" type="text/JavaScript">
function fnIndexAlert() {
    alert("Index ...");
}
</script>

<frameset rows="80,*" cols="*" framespacing="1" frameborder="yes" border="1" bordercolor="#000000">
  <frame src="nav.htm" name="topFrame" scrolling="NO" noresize >
  <frameset cols="80,*" frameborder="NO" border="0" framespacing="0">
    <frame src="one.htm" name="leftFrame" scrolling="NO" noresize>
    <frame src="one.htm" name="mainFrame">
  </frameset>
</frameset>
<noframes><body>

</body></noframes>
</html>


And my nav.htm is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>

<script language="javascript">
function fnNavAlert() {
      alert("nav");
}

function fnChangeFrame (leftURL, left,  mainURL, main) {
      parent.frames[main].document.location.href = mainURL
      parent.frames[left].document.location.href = leftURL
}
</script>

<a href="javascript:fnChangeFrame('two.htm', 'leftFrame', 'three.htm', 'mainFrame')">1</a>
<a href="javascript:fnChangeFrame('three.htm', 'leftFrame', 'one.htm', 'mainFrame')">2</a>
<a href="javascript:fnChangeFrame('one.htm','leftFrame', 'two.htm','mainFrame')">3</a>
<br>Nav bar - link # 1 will bring up the function calls.  This was use for another solution
</body>
</html>
0
 
mvan01Commented:
Hehe, I tested with these 5 files.  The one-line method in my first post was correct!

Peace and joy.  mvan

----- index.htm -----
<html>
<head>
<title>mvan - Q_21821146 solution</title>
</head>
<frameset rows="50%,*" frameborder=yes>
<frame src="a1.htm" name="FRAMEA">
<frame src="b1.htm" name="FRAMEB">
<noframes><body>
This demo works with frames<br>
</body>
</html>

----- a1.htm -----
<body>
First file for FRAMEA<br>
<a href="page_for_b.htm" target=FRAMEB onClick="javascript:self.location.href='page_for_a.htm';">load both</a>
</body>

----- b1.htm -----
<body>
First file for FRAMEB<br>
</body>

----- page_for_a.htm -----
<body>
** Second file for FRAMEA<br>
<a href="b1.htm" target=FRAMEB onClick="javascript:self.location.href='a1.htm';">reset both</a>
</body>

----- page_for_b.htm -----
<body>
** Second file for FRAMEB<br>
</body>
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
cmuirAuthor Commented:
radnor

that is great - is there a way of doubling up and making that load into 2 new frames if I have 3 frames?

Thanks

C
0
 
cmuirAuthor Commented:
sorry Radnor - forget that last comment it was for mvan01 - see your script already does this :o)
0
 
mvan01Commented:
Hi C,

I correctly answered your initial question.  :-)

If you like, we can have a routine which will change the content of ANY NUMBER of frames, and/or optionally, the navigation frame itself.  Here's the code:

----- main page, which creates the frames -----
<html>
<head>
<title>mvan - Q_21821146 solution</title>
</head>

<frameset rows="25%,*">
   <frame src="changer1.htm" name="navigation">
   <frameset cols="33%,34%,*">
      <frame src="file1.htm" name="frame1">
      <frame src="file2.htm" name="frame2">
      <frame src="file3.htm" name="frame3">
   </frameset>
</frameset>

<noframes><body>
This page was designed to use frames.  Your old browser cannot properly display this page.
</body></noframes>
</html>
----- main page ends -----

----- changer1.htm, the first navigation page -----
<html>
<head>
<title>mvan - Q_21821146 solution</title>

<script language="JavaScript" type="text/javascript">

function changeFramesHref(newCaller,frameName,newURL) {
   if (arguments.length>2) {
      for (var i=1;i<arguments.length;i++) {
         if (typeof arguments[++i]!='undefined') {
            parent.frames[arguments[i-1]].document.location.href = arguments[i];
         }
      }
   }
   if (typeof newCaller != 'undefined' && newCaller != null && newCaller != 'null') self.location.href=newCaller;
}

</script>

</head>
<body>
<a href="#" onClick="changeFramesHref('changer2.htm','frame1','file4.htm','frame2','file5.htm','frame3','file6.htm')">Load new pages in frames</a>
</body>
</html>
----- changer1.htm ends -----

----- changer2.htm, the second navigation page -----
<html>
<head>
<title>mvan - Q_21821146 solution</title>

<script language="JavaScript" type="text/javascript">

function changeFramesHref(newCaller,frameName,newURL) {
   if (arguments.length>2) {
      for (var i=1;i<arguments.length;i++) {
         if (typeof arguments[++i]!='undefined') {
            parent.frames[arguments[i-1]].document.location.href = arguments[i];
         }
      }
   }
   if (typeof newCaller != 'undefined' && newCaller != null && newCaller != 'null') self.location.href=newCaller;
}

</script>

</head>
<body>
<a href="#" onClick="changeFramesHref('changer1.htm','frame1','file1.htm','frame2','file2.htm','frame3','file3.htm')">Load new pages in frames</a>
</body>
</html>
----- changer2.htm ends -----

----- file1.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_01.gif">
----- file1.htm ends -----

----- file2.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_02.gif">
----- file2.htm ends -----

----- file3.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_03.gif">
----- file3.htm ends -----

----- file4.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_04.gif">
----- file4.htm ends -----

----- file5.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_05.gif">
----- file5.htm ends -----

----- file6.htm -----
<img src="http://www.experts-exchange.com/images/indexLogoPerson_06.gif">
----- file6.htm ends -----


You can send any number of arguments to a javascript function, regardless of how many were defined when the function was defined.

In function changeFramesHref which I present above, the first argument is the new URL (string) to be loaded into the 'current' or 'calling' frame.  That, if other than null or 'null' will be done last, after the other work is done.  The next arguments are argument pairs, and are interpreted as:

frameNameToHaveContentChanged,theNewContentURLforThatFrame

If you want to change three frames at a time, you add three pairs of arguments, as shown in the example.  The example also changes the navigation frame content.  As the function is written to cycle though any number of arguments, the calling argument list can be extended to handle any number of named frames, simultaneously.

I hope this routine can work for you.

Peace and joy.  mvan

P.S.  I originally tried to load the images directly as the url in the frame.  However, attempting to change them resulted in a security violation, because they come from a different domain than my local machine, where the code was originially run from.  Hence the use of the .htm files.
0
 
cmuirAuthor Commented:
great mvan

I have added to my page - see www.pure-fit.co.uk - can you have a look - the menu is on the LHS and when I click an item on it I get different response for 1st click to 2nd click on the same menu item (if you turn sound on then sometimes you can here two clicks - weird - is it just me?)

Cheers

Charlie
0
 
cmuirAuthor Commented:
IE 6 also says there is ActiveX in the code - must be wrong!?
0
 
cmuirAuthor Commented:
think maybe because I had <base target="main"> in my page with the script that was fouling it up
0
 
cmuirAuthor Commented:
Still getting the double click noise though and the ActiveX pop up Security Warning :o(
0
 
mvan01Commented:
Hi Charlie,

I don't see it.  The trouble, that is.  It looks nice and behaves well for me.  I'm running Win XP, IE6, security settings on medium.

The first time I run any test page from my local drive which contains JavaScript, I get:

"To help protect security, Internet Explorer has restricted this file from showing active content that could access your computer.  Click here for options."

This does not show up for me on your web page.  I'll go check on another computer which has FF installed...

mvan
0
 
Michel PlungjanIT ExpertCommented:
PS: Please observe the following when using onClick

<a href="somepage.html" target="frameb"
onClick="self.location='someotherpage.html">Change this frame with javascript and other frame with url</a>

<a href="somepage.html"
onClick="top.otherframe.location='someotherpage.html">Change this frame with url and other frame with javascript</a>

BUT

<a href="#"
onClick="top.frame1.location='otherpage.html';
top.frame2.location='someotherpage.html;
return false">Change frame1 with javascript and frame2 with javascript but this page stays - return false is mandatory</a>
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now