This code works only on safari.. godamnit

Discussion in 'Web Design and Development' started by idonotliketostu, Jun 12, 2010.

  1. idonotliketostu macrumors 6502

    Joined:
    Feb 28, 2008
    #1
    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>
    
     
  2. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #2
    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) {
     
  3. harpster macrumors regular

    Joined:
    Jan 26, 2010
    #3
    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>
     
  4. jaikob macrumors 6502

    jaikob

    Joined:
    Jul 1, 2008
    Location:
    Freeland, MI
    #4
    Maybe try a framework like prototype or jquery? Makes things stupidly easy.
     
  5. idonotliketostu thread starter macrumors 6502

    Joined:
    Feb 28, 2008
    #5
    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
     
  6. harpster macrumors regular

    Joined:
    Jan 26, 2010
    #6
    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'),
    ">
     

Share This Page