The JavaScript Source: Ajax : Ajax Navigation

Internet.commerce

Internet.com

IT
Developer
Internet News
Small Business
Personal Technology

Search internet.com
Advertise
Corporate Info
Newsletters
Tech Jobs
E-mail Offers

Great Sites

DocJavaScript.com
dhtml.com
The Freebie Directory
TheFreeSite.com

Browse Doc JS's Tips!

Promotions

Free Announcements

General

Use this script instead of frames. When a visitor clicks on a specific link, the content of that link is inserted into the page without a refresh. When a page doesn't exist, a user-friendly error message is given.

My Navagation links

Go to page 1
Go to page 2
Go to page 3
Go to page 4
Broken Link

Notes

Created by: Michael
Web Site: http://www.posters-bestellen.nl
Posted: July 24, 2006

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: ajax_navagation.js

var please_wait = null;

function open_url(url, target) {
 	if ( ! document.getElementById) {
  		return false;
 	}

 	if (please_wait != null) {
  		document.getElementById(target).innerHTML = please_wait;
 	}

 	if (window.ActiveXObject) {
  		link = new ActiveXObject("Microsoft.XMLHTTP");
 	} else if (window.XMLHttpRequest) {
  		link = new XMLHttpRequest();
 	}

 	if (link == undefined) {
  		return false;
 	}
 	link.onreadystatechange = function() { response(url, target); }
 	link.open("GET", url, true);
 	link.send(null);
}

function response(url, target) {
 	if (link.readyState == 4) {
	 	document.getElementById(target).innerHTML = (link.status == 200) ? link.responseText : "Ooops!! A broken link! Please contact the webmaster of this website ASAP and give him the fallowing errorcode: " + link.status;
	}
}

function set_loading_message(msg) {
 	please_wait = msg;
}

Head

Paste this code into the HEAD section of your HTML document.

<script type="text/javascript" src="ajax_navagation.js"></script>

  set_loading_message("Please wait while the page is opening....");

Body

Paste this code into the BODY section of your HTML document

<table>
<tr>
<td valign=top width=150>
<H5>My Navagation links</H5>
<a href="javascript:void(0)" onclick="open_url('page-1.html','my_site_content');">Go to page 1</a><br>
<a href="javascript:void(0)" onclick="open_url('page-2.html','my_site_content');">Go to page 2</a><br>
<a href="javascript:void(0)" onclick="open_url('page-3.html','my_site_content');">Go to page 3</a><br>
<a href="javascript:void(0)" onclick="open_url('page-4.html','my_site_content');">Go to page 4</a><br>
<a href="javascript:void(0)" onclick="open_url('xxxx.html','my_site_content');">Broken Link</a><br>
</td>
<td valign=top>
<div id="my_site_content">
</div>
</td>
</tr>
</table>

User Comments

Add a comment, suggestion, or correction

Comments feed

next comments...

Do you write JavaScripts?
If you do, why not submit them to us?
We'll give you credit and a link back to your Web site.

Navigation Menu

Internet.commerce

Internet.com

Developer Channel

Great Sites

Promotions

General

My Navagation links

Notes

Source Code

External file

Head

Body

User Comments

42. From: Joe
Doesn't work with other scripts.
12/03/2008 16:17:38

43. From: Lee (Admin)
01/16/2009 11:02:20

40. From: erhan
urgent! having trouble using this script :/
11/09/2008 20:24:55

41. From: Lee (Admin)
11/18/2008 11:54:25

39. From: sunita
nice script
09/16/2008 05:14:50

38. From: charu
07/15/2008 06:16:02

37. From: marcelo
works reaaly good
03/11/2008 10:51:38

36. From: DL
02/27/2008 16:50:45

32. From: hs
how to load a default page
11/14/2007 06:56:59

33. From: Lee (Admin)
11/21/2007 12:33:50

Whitepapers and eBooks

Webcasts

Downloads and eKits

Tutorials and Demos

Navigation Menu

Internet.commerce

Internet.com

Developer Channel

Great Sites

Promotions

General

My Navagation links

Notes

Source Code

External file

Head

Body

User Comments

42. From: JoeDoesn't work with other scripts.12/03/2008 16:17:38

43. From: Lee (Admin)01/16/2009 11:02:20

40. From: erhanurgent! having trouble using this script :/11/09/2008 20:24:55

41. From: Lee (Admin)11/18/2008 11:54:25

39. From: sunitanice script09/16/2008 05:14:50

38. From: charu07/15/2008 06:16:02

37. From: marceloworks reaaly good03/11/2008 10:51:38

36. From: DL02/27/2008 16:50:45

32. From: hshow to load a default page11/14/2007 06:56:59

33. From: Lee (Admin)11/21/2007 12:33:50

Whitepapers and eBooks

Webcasts

Downloads and eKits

Tutorials and Demos

42. From: Joe
Doesn't work with other scripts.
12/03/2008 16:17:38

43. From: Lee (Admin)
01/16/2009 11:02:20

40. From: erhan
urgent! having trouble using this script :/
11/09/2008 20:24:55

41. From: Lee (Admin)
11/18/2008 11:54:25

39. From: sunita
nice script
09/16/2008 05:14:50

38. From: charu
07/15/2008 06:16:02

37. From: marcelo
works reaaly good
03/11/2008 10:51:38

36. From: DL
02/27/2008 16:50:45

32. From: hs
how to load a default page
11/14/2007 06:56:59

33. From: Lee (Admin)
11/21/2007 12:33:50