Question

I want to refresh a part of the webpage automatically without refreshing the whole page. (say one division of webpage).

I have a script that calls a PHP page periodically.

Script:

<!----------- ********* AJAX code to auto refresh the part of a webpage************ --------->
<script langauge="javascript"> 
  function loadXmlHttp(url, id) {
    var f = this;
    if (loadXmlHttp.xmlHttp){
      f.xmlHttp = loadXmlHttp.xmlHttp();
      f.el = document.getElementById(id);
      f.xmlHttp.open("GET", url, true);
      f.xmlHttp.onreadystatechange = function(){f.stateChanged();};
      f.xmlHttp.send(null);
    } else {
      alert('Your browser does not support AJAX!');
    }
  }
  loadXmlHttp.xmlHttp = null;
  loadXmlHttp.re = /^http/.test(window.location.href);
  /*@cc_on @*/ // used here and below, limits try/catch to those IE browsers that both benefit from and support it
  /*@if(@_jscript_version >= 5) // prevents errors in old browsers that barf on try/catch & problems in IE if Active X disabled
  try {loadXmlHttp.ie = window.ActiveXObject}catch(e){};
  end @*/
  if (window.XMLHttpRequest && (!loadXmlHttp.ie || loadXmlHttp.re))
    loadXmlHttp.xmlHttp = function(){return new XMLHttpRequest();}; // Firefox, Opera 8.0+, Safari, others, IE 7+ when live - this is the standard method
  else if (/(object)|(function)/.test(typeof createRequest))
    loadXmlHttp.xmlHttp = createRequest; // ICEBrowser, perhaps others
  else {
    loadXmlHttp.xmlHttp = null;
    // Internet Explorer 5 to 6, includes IE 7+ when local //
    /*@if(@_jscript_version >= 5)
    try{loadXmlHttp.xmlHttp = function(){return new ActiveXObject("Msxml2.XMLHTTP");};}
    catch(e){try{loadXmlHttp.xmlHttp = function(){return new ActiveXObject("Microsoft.XMLHTTP");};}catch(e){}}
    @end @*/
  }
  loadXmlHttp.prototype.stateChanged = function(){
    if (this.xmlHttp.readyState == 4 && (this.xmlHttp.status == 200 || !loadXmlHttp.re)){
      this.el.innerHTML = this.xmlHttp.responseText;
      if(this.success){
        this.success();
      }
    }
  }
</script>
<!----------- ********* AJAX code to auto refresh the part of a webpage ends here************ --------->

And a Div where I am calling this function is something like this:

<div class="textad" id="text"></div>
  <script type="text/javascript">
    (function(){
      var statsrequest = new loadXmlHttp('display_text_ad.php', 'text'), repeat = arguments.callee;
      statsrequest.success = function(){setTimeout(repeat, 6000);};
    })();
  </script>
</div>

Now, this code is working fine with all browsers except Internet Explorer. (I have checked for Chrome, Mozilla, Opera and Safari). So, I need a little help fixing this bug with Internet Explorer. Any help will be appreciated. Thanks in advance.

Answer 1

The problem is that your initial IE conditional compilation script is missing an ‘@’ character. The end @*/ line should instead be @end @*/.

It should be pointed out, however, that using JScript version browser detection is not a good practice. A simpler, more robust approach would be to directly test for the standards you want to use and fall back to workarounds for legacy browsers. For example:

if (window.XMLHttpRequest) {
    // Use native XHR object for modern browsers
    loadXmlHttp.xmlHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
    // Use the ActiveX control for legacy browsers
    loadXmlHttp.xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
    // No XHR mechanism is available.
}