Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

idonotliketostu

macrumors 6502
Original poster
Feb 28, 2008
398
0
This code allows me to load info from another page on my website on a div on the current page. It would only work on Safari, tested it on firefox and google chrome and it would not work! Someone please help me understand why.:confused:

Code:
<head>
	
   
   
	<script type="text/javascript">
	function loadPage(url, id){
		var xmlHttp;
		try {// Firefox, Opera 8.0+, Safari
			xmlHttp = new XMLHttpRequest();		
		} catch (e) {// Internet Explorer
			try {
				xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				try {
					xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
				} catch (e) {
					alert("Your browser does not support AJAX!");
					return false;
				}
			}
		}
		xmlHttp.onreadystatechange = function(){
			if (xmlHttp.readyState == 4) {
				//Get the response from the server and extract the section that comes in the body section of the second html page avoid inserting the header part of the second page in your first page's element
				var respText = xmlHttp.responseText.split('<body>');
				elem.innerHTML = respText[1].split('</body>')[0];
			}
		}

		var elem = document.getElementById(id);
		if (!elem) {
			alert('The element with the passed ID doesn\'t exists in your page');
			return;
		}
	
		xmlHttp.open("GET", url, true);
		xmlHttp.send(null);
	}		
	</script>





</head>



<body onload="
loadPage('/test2.html', 'test2'),
">


<div id="test2" ></div>





</body>
 
B sure to check the error console for any specific messages about what may be going wrong.

You use variable elem inside xmlHttp.onreadystatechange, but don't declare it until after that function, but it's also out of scope to the function.

In addition to checking if the readyState is 4, you should also check that the status is 200.

PHP:
if (xmlHttp.status == 200) {
 
The Ajax script works in Firefox and probably IE7 (not tested) but you need to change this..

<body onload="
loadPage('/test2.html', 'test2'),
">

To this...

<body onload="loadPage('test2.html', 'test2') ">

Here's what I used: I put my content in a file named ajax_content.html in the same directory as this script. I'm sure you can still use the test2.html file that you have. Notice also that I didn't use the forward slash before the URL.

<body onload="loadPage('ajax_content.html', 'test2') ">

<p>Testing Ajax Page Loading...</p>

<div id="test2" ></div>
 
Okay I fixed it, works for all browsers now!. I just placed the script in a js file and linked it to the page. Weird
 
Okay I fixed it, works for all browsers now!. I just placed the script in a js file and linked it to the page. Weird

That makes no sense... it's the same code so should work on the page or linked from another page. The problem was the comma after 'test2),. If that comma is there than it will only work in Safari which must ignore that. In Firefox it won't work unless you remove the comma.

loadPage('/test2.html', 'test2'),
">
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.