Javascript Ajax Class ...

A JavaScript Ajax class for client / server communication. The Ajax request objects are stored in an array so that its possible for multiple requests to be running simultaneously.
view plaincopy to clipboardprint?

   1.
      /*
   2.
        _________
   3.
       |  INFO   |__________________________________________________________________
   4.
       |                                                                            |
   5.
       | ajax.js                                                                    |
   6.
       | Version 1.0.1 - 03/09/2007                                                 |
   7.
       | Copyright 2007 Karl Payne                                                  |
   8.
       |____________________________________________________________________________|
   9.
        _________________
  10.
       | RELEASE HISTORY |__________________________________________________________
  11.
       |                                                                            |
  12.
       | * v1.01 20-07-07 Chaged repsone type for plain text from responseXML to    |
  13.
       |   responseText                                                             |
  14.
       | * v1.00 17-07-07 Initial public development release                        |
  15.
       |____________________________________________________________________________|
  16.
        _________
  17.
       | LICENSE |__________________________________________________________________
  18.
       |                                                                            |
  19.
       | This program is free software; you can redistribute it and/or modify       |
  20.
       | it under the terms of the GNU General Public License as published by       |
  21.
       | the Free Software Foundation; either version 3 of the License, or          |
  22.
       | (at your option) any later version.                                        |
  23.
       |                                                                            |
  24.
       | This program is distributed in the hope that it will be useful,            |
  25.
       | but WITHOUT ANY WARRANTY; without even the implied warranty of             |
  26.
       | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the              |
  27.
       | GNU General Public License for more details.                               |
  28.
       |                                                                            |
  29.
       | You should have received a copy of the GNU General Public License          |
  30.
       | along with this program.  If not, see <http://www.gnu.org/licenses/>       |
  31.
       |____________________________________________________________________________|
  32.
        _________
  33.
       | CREDIT  |__________________________________________________________________
  34.
       |                                                                            |
  35.
       | This program wouldn have been possible without the following resources   |
  36.
       | http://www.drakware.com/?d=2006-08                                         |
  37.
       | http://javascript.about.com/library/blajax08.htm                           |
  38.
       | http://www.wrox.com - for most of the other stuff                          |
  39.
       |____________________________________________________________________________|
  40.
      */
  41.
      
  42.
      /////////////////////////////////////////////////////////////////////////////////////////////////////////////
  43.
      
  44.
      // determine whether its possible to use the XML HTTP request object (Mozilla et all first then IE)
  45.
      // typeof XMLHttpRequest returns function, instead of "object" as suggested by wrox.com
  46.
      var bXmlHttpSupport = (typeof XMLHttpRequest != "undefined" || window.ActiveXObject);
  47.
      
  48.
      // builds a paramater string for use in a post request
  49.
      function addPostParam(sParams, sParamName, sParamValue) {
  50.
          // check if the current paramater string is longer than 0 chars (2 would be the min surely? a=)
  51.
          if (sParams.length > 0) {
  52.
              sParams += "&";
  53.
          }
  54.
          // url encode both the paramater and the variable
  55.
          return sParams + encodeURIComponent(sParamName) + "="  + encodeURIComponent(sParamValue);
  56.
      }
  57.
      
  58.
      // adds a variable to a url string and returns it
  59.
      function addURLParam(sURL, sParamName, sParamValue) {
  60.
          // if there is already variables in the url add an & otherwise start the query string off with a ?
  61.
          sURL += (sURL.indexOf("?") == -1 ? "?" : "&");
  62.
          // url encode both the paramater and the variable
  63.
          sURL += encodeURIComponent(sParamName) + "=" + encodeURIComponent(sParamValue);
  64.
          return sURL;
  65.
      }
  66.
      
  67.
      // allows us to use the same object name (as IE) in all supporting browsers XMLHttpRequest
  68.
      if (typeof XMLHttpRequest == "undefined" && window.ActiveXObject) {
  69.
          function XMLHttpRequest() {
  70.
              // an array of different versions in reverse order, so we try the latest version first
  71.
              var arrSignatures = ["MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0",
  72.
                                   "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP",
  73.
                                   "Microsoft.XMLHTTP"];
  74.
              // loop through the array of versions
  75.
              for (var i=0; i < arrSignatures.length; i++) {
  76.
                  try {
  77.
                      // try and create an object using the current name
  78.
                      var oRequest = new ActiveXObject(arrSignatures[i]);
  79.
                      return oRequest;
  80.
                  } catch (oError) {
  81.
                      //ignore
  82.
                  }
  83.
              }
  84.
              throw new Error("MSXML is not installed on your system.");
  85.
          }
  86.
      }
  87.
      
  88.
      // stores a global array of request objects
  89.
      var aRequests = new Array(); 
  90.
      
  91.
      // creates an array of objects so multiple ajax calls can be made simultaneously, each using their own object
  92.
      function AJAX_Broker(lockStatus) {
  93.
          // if = 1 locks the object so only the correct object is requests can access it
  94.
          this.locked = lockStatus;
  95.
          // no need to check the browser capabilities here
  96.
          // this function is only called if it works
  97.
          this.oRequest = new XMLHttpRequest();
  98.
      } 
  99.
      
 100.
      function AJAX_get(sURL, fnCallback) {
 101.
          // check if the broweser supports XMLHttp
 102.
          if (bXmlHttpSupport) {
 103.
              var pos = -1;
 104.
              // search the array for an unlocked object
 105.
              for (var i=0; i<aRequests.length; i++) {
 106.
                  if (aRequests[i].locked == 1) {
 107.
                      pos = i;
 108.
                      break;
 109.
                  }
 110.
              }
 111.
              // if we couldnt find a spare one
 112.
              if (pos == -1) {
 113.
                  // create a new one, passing in the unlock code = 1
 114.
                  pos = aRequests.length;
 115.
                  aRequests[pos] = new AJAX_Broker(1);
 116.
              }
 117.
              if (aRequests[pos].oRequest) {
 118.
                  // set the freed property of our new object to 0 to prevent anything else using it
 119.
                  aRequests[pos].locked = 0;
 120.
                  // type, url, asynchronous
 121.
                  aRequests[pos].oRequest.open("GET", sURL, true);
 122.
                  // assign an event handler to watch for state changes
 123.
                  aRequests[pos].oRequest.onreadystatechange = function() {
 124.
                      // check if the response is ready to be dealt with
 125.
                      if (AJAX_change(pos)) {
 126.
                          // get the content type (search for xml because it could be: "text/xml; charset=ISO-8859-1")
 127.
                          sContentType = aRequests[pos].oRequest.getResponseHeader("Content-Type");
 128.
                          if (sContentType.indexOf("xml") == -1) {
 129.
                              // pass the response as plain text to our callback function
 130.
                              fnCallback(aRequests[pos].oRequest.responseText);
 131.
                          } else {
 132.
                              // pass the XML response to our callback function
 133.
                              fnCallback(aRequests[pos].oRequest.responseXML);
 134.
                          }
 135.
                      }
 136.
                  }
 137.
                  // send it all off and let the event handler do its work
 138.
                  aRequests[pos].oRequest.send(null);
 139.
              }
 140.
          } else {
 141.
              alert("Your browser doesn support HTTP get requests.");
 142.
          }
 143.
      }
 144.
      
 145.
      function AJAX_post(sURL, sParams, fnCallback) {
 146.
          // check if the broweser supports XMLHttp
 147.
          if (bXmlHttpSupport) {
 148.
              var pos = -1;
 149.
              // search the array for an unlocked object
 150.
              for (var i=0; i<aRequests.length; i++) {
 151.
                  if (aRequests[i].locked == 1) {
 152.
                      pos = i;
 153.
                      break;
 154.
                  }
 155.
              }
 156.
              // if we couldnt find a spare one
 157.
              if (pos == -1) {
 158.
                  // create a new one, passing in the unlock code = 1
 159.
                  pos = aRequests.length;
 160.
                  aRequests[pos] = new AJAX_Broker(1);
 161.
              }
 162.
              if (aRequests[pos].oRequest) {
 163.
                  // set the freed property of our new object to 0 to prevent anything else using it
 164.
                  aRequests[pos].locked = 0;
 165.
                  // type, url, asynchronous
 166.
                  aRequests[pos].oRequest.open("POST", sURL, true);
 167.
                  // assign an event handler to watch for state changes
 168.
                  aRequests[pos].oRequest.onreadystatechange = function() {
 169.
                      // check if the response is ready to be dealt with
 170.
                      if (AJAX_change(pos)) {
 171.
                          // get the content type (search for xml because it could be: "text/xml; charset=ISO-8859-1")
 172.
                          sContentType = aRequests[pos].oRequest.getResponseHeader("Content-Type");
 173.
                          if (sContentType.indexOf("xml") == -1) {
 174.
                              // pass the response as plain text to our callback function
 175.
                              fnCallback(aRequests[pos].oRequest.responseText);
 176.
                          } else {
 177.
                              // pass the XML response to our callback function
 178.
                              fnCallback(aRequests[pos].oRequest.responseXML);
 179.
                          }
 180.
                      }
 181.
                  }
 182.
                  // setRequestHeader must be called after open to prevent an uncaught exception
 183.
                  aRequests[pos].oRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 184.
                  // send it all off and let the event handler do its work
 185.
                  aRequests[pos].oRequest.send(sParams);
 186.
              }
 187.
          } else {
 188.
              alert("Your browser doesn support HTTP post requests.");
 189.
          }
 190.
      } 
 191.
      
 192.
      // event handler
 193.
      function AJAX_change(pos) {
 194.
          // a few checks ..
 195.
          // - that a position was passed in - should pretty much always be the case
 196.
          // - that its freed - again pretty useless as we should have just created it in the get or post functions
 197.
          // that the ready state is 4 (completely loaded)
 198.
          if (typeof(aRequests[pos]) != undefined &&
 199.
              aRequests[pos].locked == 0 &&
 200.
              aRequests[pos].oRequest.readyState == 4 ) {
 201.
              // check the headers status : 200 =  OK || 304 = Not Modified
 202.
              // some advanced browsers such as opera actually use an http mechanism called "conditional get"
 203.
              // which returns a code 304
 204.
              if (aRequests[pos].oRequest.status == 200 || aRequests[pos].oRequest.status == 304) {
 205.
                  return true;
 206.
              } else {
 207.
                  alert("Server has not responded correctly.");
 208.
              }
 209.
              // set freed property of the object to 1 so that something else can use it
 210.
              aRequests[pos].locked = 1;
 211.
          }
 212.
          return false;
 213.
      } 

source: cherrystudios

 View Full Story.