Solved

How can I open a specific page (which is part of a frameset) from another external page?

Posted on 2000-04-24
14
167 Views
Last Modified: 2010-04-09
I don't know if this can be done with just HTML (or if I should be asking this in the Javascript section.)  But, if it is possible to do with HTML, I would appreciate an answer.

Question ...

Go look at:

http://web.njcu.edu/mis/support.html

What I want is to be able to create a link on one of my other pages that will open up the page ...

http://web.njcu.edu/mis/support/njcuonline.html

in the  frame position named 'support' .

Rather than having the user go to the page at:

http://web.njcu.edu/mis/support.html , and then tell them to click here or there in order to navigate to the page I want to have it load in the frame window named 'support' (which is the bottom right frame) ... I want a single link to be placed on another page that will automatically open up the page ...

http://web.njcu.edu/mis/support.html ... but ... with the page  njcuonline.html loaded in the frame position named 'support' ... instead of the page  support2.html.

Can this be done without creating a new 'frameset' page - for this link?????  Or, is this the only way?

Help???

Thanks,
Gary

I hope I explained my question well enough.

0
Comment
Question by:garymgordon
  • 6
  • 4
  • 2
  • +1
14 Comments
 
LVL 33

Expert Comment

by:knightEknight
ID: 2744358
You can use the TARGET attribute to specify the frame name:

<A href="njcuonline.html"   TARGET="support">Click Me</a>

... however, the frame name is case-sensitive -- that is "Support" is not the same as "support".
0
 
LVL 33

Expert Comment

by:knightEknight
ID: 2744364
Sorry, it looks like I mis-read your question.
0
 

Author Comment

by:garymgordon
ID: 2744425
Yes.  I guess you did and I'm sorry, but that doesn't actually work - as I'm sure you realize.   I appreciated the reply, but let me know if you come up with the answer.  (Other than just creating a new frameset page.)

Thanks again,
Gary

0
 
LVL 8

Expert Comment

by:jbirk
ID: 2745337
If I understand correctly, you want to go to a new page which has the frameset http://web.njcu.edu/mis/support.html except instead of using support2.html as the page for frame 'support' you want njcuonline.html.

If this is the case you can use the query string to do this.  I've done this before...  but don't have the code here with me.  I'll try to think it up from scratch, but it won't be tested.  I'll check it sometime tonight from home....

When changing the location, compile the frame name and url (this is in a javascript section):

var url = escape("njcuonline.html")
document.location = "http://web.njcu.edu/mis/support.html?support="+url

Then in the frameset (also in a javascript section, probably onLoad handler):
var str = location.search;
if (str.length > 0)
 {str = str.substring(1); // remove the ?
  arr = split(arr,"=");
  arr[1] = unescape(arr[1]);
  if (arr[0] == 'support')
    top.support.document.location = arr[1];
 }

That's off the top of my head so I'm not sure if it's 100% correct.  I'll check when I get home.

-Josh
0
 
LVL 3

Expert Comment

by:fibdev
ID: 2747448
Far as I can tell it looks pretty good josh.
0
 
LVL 8

Expert Comment

by:jbirk
ID: 2747486
Oops, forgot to check last night....

gary, do you understand the code I wrote yesterday?  If not I can explain some of it.  If so, could you give it a try and see if it works for you?

I do see one typo though.  I used split wrong.  That line should be:
arr = arr.split("=");

-Josh
0
 
LVL 3

Expert Comment

by:fibdev
ID: 2747532
arr  (I missed it too josh :)
0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 

Author Comment

by:garymgordon
ID: 2747602
I apologize for my lack of knowledge when it comes to this ... but here is where I'm at ...

1)  If you go to ...

http://web.njcu.edu/mis/news.html

You'll see 4 links on the right.
For example, one is going to:

NJCU Online Support

(Currently it is set up to go to a 'revised' frameset page so it will reload with the proper page in the frameset.)

2)  I see the code that you gave me above, but I don't exactly know where to put it on the html pages??  Such as, what goes on what line, what goes in the head, what goes in the body ... and where??

If you could tell me where... that would help.  Again, sorry for my ignorance in the matter.

Plus, if you could add comments to the javascript coding so I could better understand what it's doing, ... that would be wonderful.

Thanks,
Gary
0
 
LVL 8

Expert Comment

by:jbirk
ID: 2748140
sorry gary, I'll try to be more specific.

After looking at your page though, it looks like a simpler solution might be to just have a multiple frame change, instead of my above suggested solution.  Since the frameset appears the same except that two frames are changed, you could just change those two frames instead.

To do this, on any link which needs the two frames changed, use a javascript call instead of an href link:
<A HREF="JavaScript:;" onClick="twoFrames('frame1.html','frame2.html'); return false;">link</A>

Then within the header of the document:
<SCRIPT language="JavaScript">
<!--
function twoFrames(link1,link2)
{
 top.navbar.location=link1;
 top.main.location=link2;
}
// -->
</SCRIPT>

Unfortunately to do this you need to rename the main frame for all the framesets and change all your targets from your java applet:(  It's simpler javascript though:)

So. if you prefer the previously mentioned javascript method, here comes that explanation...

-Josh
0
 
LVL 8

Accepted Solution

by:
jbirk earned 75 total points
ID: 2748206
OK, for your links, with this method it will be similar.  They should look like this:

<A HREF="JavaScript:;" onClick="loadPage('frame1.html'); return false;">link</A>

Then put this in the header of your page:
SCRIPT language="JavaScript">
<!--
function loadPage(url)
{
 url = escape(url); // this escapes the string so bad characters don't screw up the url
 top.document.location = "http://web.njcu.edu/mis/support.html?support="+url; // load the new frameset as the top document, giving it the url as an argument string
}
// -->
</SCRIPT>

The above function will have to modified for each section you want to do this for.  All you do is modify the base url which is the part in quotes.  The "support=" part isn't actually necesary but it allows for you to change multiple frames in the future.  You'll be able to specify the support and navbar frames for instance.  That would look like this:
 top.document.location = "http://web.njcu.edu/mis/support.html?support="+supportURL+"\&navbar="+navbarURL;


OK, then in the frameset page which loads the new frame, here is the entire page (I used news on accident, but it should be easy to change it for support):

<HTML>
<HEAD>
<TITLE>NJCU / NEW JERSEY CITY UNIVERSITY ** MIS & COMPUTER SERVICES **</TITLE>
<META NAME="Description" CONTENT="NJCU (New Jersey City University) offers a wide range of educational and challenging programs.">
<META NAME="Keywords" CONTENT="NJCU, New, Jersey, City, University, New Jersey City University, Jersey City University, New Jersey Colleges, New Jersey Universities, College, University, Continued Education, Graduate, Schools">
<META HTTP-EQUIV="Window-target" CONTENT="_top">
<META NAME="ROBOTS" CONTENT="INDEX, ALL">
</HEAD>

<FRAMESET ROWS="140, *" BORDER="0" FRAMEBORDER="0">
<FRAME NAME="top" SRC="mislogo.html" SCROLLING="NO" NORESIZE>
<FRAMESET COLS="210, *" BORDER="0" FRAMEBORDER="0">
<FRAME NAME="navbar" SRC="navbars/news/apptag.htm" SCROLLING="AUTO" NORESIZE>
<FRAME NAME="news" SRC="blank.html" SCROLLING="AUTO" NORESIZE>
<!-- blank needs to be just a blank html page so it loads quickly.  This will hopefully stop the flicker and prevent wasted download of the wrong page.-->
</FRAMESET>
</FRAMESET>
SCRIPT language="JavaScript">
<!--
// I put this down here so that I'm ensured that the frameset is at least loaded before trying to modify it
var str = top.location.search; // grab the search string including the ?
if (str.length > 0)
{str = str.substring(1); // remove the ?
 arr = arr.split("="); // split it by the = this gives two strings in the array
 arr[1] = unescape(arr[1]); // restore the string from being escaped
 if (arr[0] == 'news') // check to be sure the right frame is being changed...
// again this is really only for future expansion to allow multiple frames to get changed
   top.news.document.location = arr[1]; // change the url
 else
  top.new.document.location = "deafulturl.html";
}
 else
  top.new.document.location = "deafulturl.html";
 // be sure to set the default url in case the search string isn't there so a page loads properly in the main frame.
// -->
</SCRIPT>
<NOFRAMES>
<BODY>In order to view these pages you will need to use Frames and Java. &nbsp; Please update your browser with the latest version of Netscape or Internet Explorer.<BR>
</BODY>
</NOFRAMES>
</HTML>
0
 
LVL 8

Expert Comment

by:jbirk
ID: 2748217
If you have any firther questions about either method, feel free to ask!

-Josh
0
 

Author Comment

by:garymgordon
ID: 2748286
Adjusted points from 30 to 75
0
 

Author Comment

by:garymgordon
ID: 2748287
Thanks a lot!!!
0
 
LVL 8

Expert Comment

by:jbirk
ID: 2748299
Your welcome!  Hope it all works out for you.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Do you want to insert HTML5 video into your site? This is the tutorial how to do so. What are the main advantages of HTML5 video? 1) Have good compression, good image quality, and low decode processor use. 2) It is royalty-free 3) It is easi…
Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…

743 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now