?
Solved

One html page (page 1) with links and no frames to one html page with frames (page 2) - target of body (page 2) depending on link selected on Page 1 (using HTML and Javascript only)

Posted on 2004-11-22
9
Medium Priority
?
266 Views
Last Modified: 2010-04-06
I have an HTML page with a bunch of links on it. Depening on the link clicked on in page 1, it has to navigate to a frames page. My problem is that depending on the link clicked on on the first page, I have to set the URL for the body frame on the next page (frames page). I don't want to create a frames page for each of the links, as this would result in about 49 pages! Also, and here's the problem, I can only use HTML and Javascript... No ASP or PHP etc... ONLY HTML and JScript!

What I did up to now was to do the following:
On page one the <a> tags' hrefs are set as follows "framespage.htm?Name=page1", "framespage.htm?Name=page2", "framespage.htm?Name=page3" etc...
Then, on the frames page, I've got Javascript that can get the Name variable from the query string (see below function PageName), but I have no idea how to use this to set the body frame's src. I know the function works, but I have no idea where to call it etc...

Here follows the Frames Page code:

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <script language='javascript'>
            function PageName()
            {
                  var query = unescape(window.location.search.substring("?"));
                  var LoadName  = request(query,"name") + '.htm'
                  return LoadName;
             }
            
            function request(query,name)
            {
                  var x = query.indexOf(name)+name.length+1;
                  if(x!=-1)
                  {
                        var y = query.indexOf("&",x);
                        if (y==-1)y=query.length;      
                        return query.substring(x,y);
                  }
            }      
            
          
      </script>

</head>
<frameset rows="*" cols="152,*" frameborder="NO" border="0" framespacing="0">
  <frame src="left.htm" name="left" scrolling="NO" noresize id="left">
  <frameset rows="36,*,43" cols="*" framespacing="0" frameborder="NO" border="0">
    <frame src="top.htm" name="top" scrolling="no" id="top">
      <frame src="" name="body" noresize id="body">
    <frame src="bottom.htm" name="bottom" scrolling="no" id="bottom">
  </frameset>
</frameset>
<noframes><body>

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


Am I on the right track at all?????

Thanx!
0
Comment
Question by:KlockWurk
  • 5
  • 4
9 Comments
 
LVL 9

Expert Comment

by:imnajam
ID: 12642388
Hi KlockWurk,

you may try to put the script in TOP.HTM file and than at the end of function you can change the content of the frame by "this.document.bottom.location=<ur URL here>"

Cheers!
0
 
LVL 2

Author Comment

by:KlockWurk
ID: 12644006
Yello imnajam

I did think of somthing like this, but how do I pass the query string variable to the TOP.htm page?

Thanks for the reply!
0
 
LVL 9

Accepted Solution

by:
imnajam earned 2000 total points
ID: 12644203
hello KlockWurk

check out the PAQ @ [ http://www.experts-exchange.com/Web/Web_Languages/JavaScript/Q_10314824.html]

hope it helps
0
Industry Leaders: 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!

 
LVL 2

Author Comment

by:KlockWurk
ID: 12647869
You are a star! OK, with all the above I made a work around:
For reference here is what I did:

I changed the frames page as follows:

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<form name="fmHidden">
      <input type="hidden" name="hidName" ID="hidName" value="">
</form>

<script language='javascript'>
      var query = unescape(window.location.search.substring("?"));
      var LoadName  = request(query,"name") + '.htm'
      document.fmHidden.hidName.value = LoadName;
            
      function request(query,name)
      {
            var x = query.indexOf(name)+name.length+1;
            if(x!=-1)
            {
                  var y = query.indexOf("&",x);
                  if (y==-1)y=query.length;      
                  return query.substring(x,y);
            }
      }      
            
</script>

<frameset rows="*" cols="152,*" frameborder="NO" border="0" framespacing="0">
  <frame src="menu.htm" name="left" scrolling="NO" noresize id="left">
  <frameset rows="36,*,43" cols="*" framespacing="0" frameborder="NO" border="0">
    <frame src="top.htm" name="top" scrolling="no" id="top">
      <frame src="" name="body" noresize id="body">
    <frame src="bottom.htm" name="bottom" scrolling="no" id="bottom">
  </frameset>
</frameset>
<noframes><body>

</body></noframes>

</html>

OK, then I added the following to the top.htm

function OpenCorrectPage()
{
      var OpenPage = parent.fmHidden.hidName.value;
      parent.body.location=OpenPage;
}

Also, in the BODY tag now looks as follows:
<body leftmargin="0" topmargin="0" onload="OpenCorrectPage();">

So here's what happens:
On the first page you click on a link and it opens the frames page with the URL:
frame.htm?name=page1 or frame.htm?name=page2 or frame.htm?name=page3 etc

On the frames page, the query string's value is placed into a hidden variable (hope that brigmar doesn't mind, I used his name fmHidden for my form - I liked it :P )
The frames then load the top page, the menu and the bottom. When the Top loads it picks up the value set in the frames page in the hidden variable and then sets the body part of the frames to what ever is stored in the variable. Cool!!!! Now who would have thought HTML and Java could be so clever! When this site is live, I'll post the URL where it is used.

Thanks for being my guide through these dark and troublesome times...
0
 
LVL 2

Author Comment

by:KlockWurk
ID: 12647900
Don't spend all the points in one place, you hear!
0
 
LVL 9

Expert Comment

by:imnajam
ID: 12647956
thank for the grade and point but I don't understand what do you mean to say by "Don't spend all the points in one place, you hear!"

btw, congrats(Y)
0
 
LVL 2

Author Comment

by:KlockWurk
ID: 12652082
When you were little, when someone gave you some money, they would say, "don't spend it all in one place"... ;)

Have a great day!
0
 
LVL 2

Author Comment

by:KlockWurk
ID: 12652090
Ooooh, btw, if anyone uses the above, please let me know what you think about the solution, or if you find a better way to do it, also just drop a post here.

Thanks!
KlockWurk
0
 
LVL 9

Expert Comment

by:imnajam
ID: 12652093
umm okay,
all the best for your project/site
0

Featured Post

Upgrade your Question Security!

Add Premium security features to your question to ensure its privacy or anonymity. Learn more about your ability to control Question Security today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preface In the first article: A Better Website Login System (http://www.experts-exchange.com/A_2902.html) I introduced the EE Collaborative Login System and its intended purpose. In this article I will discuss some of the design consideratio…
Preface This is the third article about the EE Collaborative Login Project. A Better Website Login System (http://www.experts-exchange.com/A_2902.html) introduces the Login System and shows how to implement a login page. The EE Collaborative Logi…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question