Page 1 of 1

AJAX not working in IE8

Posted: Fri Dec 10, 2010 5:50 am
by oscardog
Hello,

The code works fine in Firefox and other modern browsers (even IE7 and IE9) but for some reason IE8 it just doesn't work.

I have used some alerts to try find the problem and as far as I can tell it setups the ajaxRequest / XMLHTTPRequest fine, however when I put an alert in the readyState 1 / 2 / 3 part nothing comes up so it looks like the script, for some reason, isn't sending the request.

This is the code

Code: Select all

function switchProduct(id) {
	
	
	var ajaxRequest;  // The variable that makes Ajax possible!
	
	
 try
 {
  var ajaxRequest = new XMLHttpRequest();
 }

 catch(err1)
 {
  //For older browsers (IE6 etc)
  var ieXmlHttpVersions = new Array();
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp.7.0";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp.6.0";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp.5.0";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp.4.0";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp.3.0";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "MSXML2.XMLHttp";
  ieXmlHttpVersions[ieXmlHttpVersions.length] = "Microsoft.XMLHttp";

  var i;
  for (i=0; i < ieXmlHttpVersions.length; i++)
  {
   try
   {
    var ajaxRequest = new ActiveXObject(ieXmlHttpVersions[i]);
    //document.getElementById("Content").innerHTML="<h1>Using " + ieXmlHttpVersions[i] + "</h1>";
	
    break;
   }
   catch (err2)
   {
    
   }
  }
 }

ajaxRequest.onreadystatechange = function(){
	if(ajaxRequest.readyState == 4){
		var searchResponse = ajaxRequest.responseText;
		
		if(searchResponse != "") {
			splitResponse = searchResponse.split("---");
			
			$('#prod_detail_box').fadeOut('slow', function() {
				document.getElementById("prod_detail_box").style.backgroundImage = "none";
    			document.getElementById("prod_detail_box").innerHTML = '<a href="ecom-prodshow/' + splitResponse[1] + '.html" title="' + splitResponse[2] + ' - ' + splitResponse[0] + '"><img src="media/ecom/prodlg/' + splitResponse[3] + '" alt="' + splitResponse[2] + ' - ' + splitResponse[0] + '"></a><p class="aller">' + splitResponse[2] + '</p><p><a href="ecom-prodshow/' + splitResponse[1] + '.html">Full Specification</a>';
				$("#prod_detail_box").fadeIn('slow');
  			});

			
			
		} 
		
	} else if(ajaxRequest.readyState == 1 ||ajaxRequest.readyState == 2 || ajaxRequest.readyState == 3) {
		document.getElementById("prod_detail_box").style.backgroundImage = "url(media/loading.gif)";
	}
}

var url = "grab_prod.php";
var params = "prodid=" + id;
ajaxRequest.abort();
ajaxRequest.open("POST",url,true);
ajaxRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
ajaxRequest.send(params);

}
Any ideas?

Thanks!

Re: AJAX not working in IE8

Posted: Sat Dec 11, 2010 1:58 am
by greyhoundcode
Does JQuery's ajax implementation work with IE8?

Re: AJAX not working in IE8

Posted: Fri Dec 17, 2010 8:14 pm
by Jonah Bron
It's my understanding that Internet Explorer has supported the XMLHttpRequest object since version 7.

Re: AJAX not working in IE8

Posted: Sun Dec 19, 2010 10:29 pm
by innovativeinfosln
Quite possible what you think can be right .
but i would suggest that there can be an Error is invalid property value.

Re: AJAX not working in IE8

Posted: Mon Dec 20, 2010 2:59 am
by Darhazer
This is a scope resolution issue in the code.
Remove the unnecessary 'var' in xmlhttp initialization - only the first var ajaxRequest should be with var, as it introduces the variable in the function scope. The next assignments to ajaxRequest should be without var, so they remain in the scope of the whole function, and not in the loop scope for example.