[Webinar] Streamline your web hosting managementRegister Today

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

Load target page info with no refresh

Hello Experts,

I have two pages, test.asp and test2.asp. I have a static menu on test.asp (Page 1), just basic internal urls.  When I click on a link, I would like to reload test.asp (Page 1) with the data from test2.asp (Page 2) without refreshing.

Thanks in advance!
Page1.gif
Page2.gif
Page1Results.gif
0
thomasgroup
Asked:
thomasgroup
  • 2
  • 2
1 Solution
 
ellandrdCommented:
this definately sounds like a job for Javascript.. what information do you want/need to make this work?
0
 
thomasgroupAuthor Commented:
Basically I would like a working example for the pages.
0
 
ellandrdCommented:
This should do the job, I have tested it in FF2 & IE6, of course you should add doctypes and the likes to suit your site

- ellandrd
<html> 
<head>
  <script language="JavaScript">
var CallbackElementID;	
	
function GetXmlHttpObject(handler) { 
	var objXMLHttp = null;
	if (window.XMLHttpRequest) { objXMLHttp = new XMLHttpRequest();	} // firefox & Mozilla based browsers
	else if (window.ActiveXObject) {	objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");	} // Internet Explorer based browsers
	return objXMLHttp;
}
function fnSearchSKUCallback()  { // XMLhttp callback function
	if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { 
	CallbackElementID.innerHTML = xmlHttp.responseText;
	}
} 
function LoadContent(elementID, url) {
	CallbackElementID = document.getElementById(elementID); 
	xmlHttp = GetXmlHttpObject();
	xmlHttp.onreadystatechange=fnSearchSKUCallback;	// set the callback function (the function called when the status changes, ie the page loads)
	xmlHttp.open("GET",url,true);		
	xmlHttp.send(null);
}
  </script>
</head>
<body>
   Page 1
 <div id="contentdiv">
   <a href="JavaScript:LoadContent('contentdiv', 'test2.asp')">test</a>
 </div>
</body>
</html>

Open in new window

0
 
thomasgroupAuthor Commented:
Works like a champ! Thanks!
0

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

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