0

Greetings. I'm stumped with a particular problem involving an ajax script that works for Firefox, Opera, Safari, and Chrome... but unfortunately does not work with any version of IE (*actually I haven't tested IE6 or less yet, but who cares about those anymore*).

On the HTML side, a list of hospitals is generated, and when a hospital is selected, the content changes, based on the selection. In addition, the script also runs 'onload' to generate the initial list. The script is below, and the incomplete example can be seen at http://www.aahcp.com/nusurvey.php

function narrowSelection(){
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null){alert("Browser does not support HTTP Request");return;}
var url="scripts/multiscript.php?narrowSelection="+document.getElementById('keyword').value;
xmlhttp.onreadystatechange=stateChangedA;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);}

function stateChangedA(){
if (xmlhttp.readyState==4){document.getElementById("hospitallist").innerHTML=xmlhttp.responseText;}}

function GetXmlHttpObject(){
if (window.XMLHttpRequest){/* code for IE7+, Firefox, Chrome, Opera, Safari */
return new XMLHttpRequest();}
if (window.ActiveXObject){/*code for IE6, IE5*/
return new ActiveXObject("Microsoft.XMLHTTP");}return null;}

Thanks in advance for any assistance!

3
Contributors
6
Replies
7
Views
8 Years
Discussion Span
Last Post by farhan386
0

Hi kintaro,

try this code:

<script type="text/javascript">
// <![CDATA[
var d = document;
var GetXmlHttpObject = 0;
if ( d.getElementById ) {
( GetXmlHttpObject = function( ) {
  var req = 0;
  if ( req = new XMLHttpRequest() ) {
     return req;
  } try { 
      var client = [ "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
      var cLen = client.length; 
      for( var x = 0; x < cLen; x++ ) {
         if( req = new ActiveXObject( client[ x ] )) {
            return req;
         }
      }
   } catch( e ) { 
     alert( "Browser does not support HTTP Request." );
     return 0;
   }
} ); var stateChangedA = function() {
   d.getElementById("hospitallist").innerHTML = ( function( xhr ) {
   if(( { 4 : 4, complete : 4 }[ xhr.readyState ] )) 
      return xhr.responseText;
   else
      return "HTTP Request failed!";
   } )( this );
}

var narrowSelection = function() { 
   var xmlHttp = GetXmlHttpObject(); 
   if ( xmlHttp ) {
      var url = "./script/multiscript.php?narrowSelection=" + d.getElementById("keyword").value; 
      (( "overrideMimeType" in xmlHttp ) ? xmlHttp.overrideMimeType("text/xml") : xmlHttp );
      xmlHttp.onreadystatechange = stateChangedA;
   xmlHttp.open( "GET", encodeURIComponent( url ), true );
   xmlHttp.send( null );
   return;
   } void( 0 ); 
}; window.onload = narrowSelection;
}

// ]]>
</script>
0

I will give that a try. I may have to tweak it a bit for the server-side.

0

No good :-( It also stopped working for the other browsers, too. Thanks for trying, though!

0

I think I need to also mention that this server language is php, not asp.

0

Hi,

this should be able to work under rough condition:

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html id="xhtml10S" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>www.daniweb.com</title>
<script type="text/javascript">
// <![CDATA[

var GetXmlHttpObject = function() {
var xml = 0;
   try {
      if ( "XMLHttpRequest" in window ) {
         xml = new XMLHttpRequest();
      } else if ( "ActiveXObject" in window ) {
      var client = [ "MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP" ];
         try {
            for ( var x = 0; x < client.length; x++ ) {
               if ( new ActiveXObject( client[ x ] )) {
                  xml = new ActiveXObject( client[ x ] );
                  break;
               }
            }
         } catch( e1 ) { xml = 0; 
         }
      }
   } catch( e ) {
      if ( "createRequest" in window ) {
         xml = window.createRequest();
      } 
   } return xml;
};

var narrowSelection = function() {
   var xmlHttp = GetXmlHttpObject();
   if ( xmlHttp ) {
      var keywords = document.getElementById( "keyword" ) || keyword;
      var url = "script/multiscript.php?narrowSelection=" + encodeURIComponent( keywords.value );
   (( "overrideMimeType" in xmlHttp ) ? xmlHttp.overrideMimeType("text/xml") : xmlHttp );
   xmlHttp.onreadystatechange = function() { 
   var hospital = document.getElementById( "hospitallist" ) || hospitallist; 
   if ( { 4 : 4, complete : 4 }[ this.readyState ] && ( { 0 : "offline", 200 : "online" }[ this.status ] )) {

      hospital.innerHTML = this.responseText;

   } 
};
   xmlHttp.open( "GET", url, true );
   xmlHttp.send( null );
   return;
   } alert( "Your Browser does not support HTTP Request!" );
};
// ]]>
</script>
</head>
<body>
<noscript>
<p>This site requires a browser that support <b>JavaScript</b>. </p> 
</noscript>
<div>
<div style="margin-bottom : 1em;" id="hospitallist"></div>
Enter Keyword: <input type="text" id="keyword" name="keyword" value="" size="30" onchange="narrowSelection()" />
</div>
</body>
</html>
0

You may want to user javascript library such jQuery. jQuery is able to make ajax call, or many more javascript stuff for all major browser with a single code. Write less, do more :)

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.