« Blog Home

§ Simple AJAX request

Almost all of my AJAXing is to simply grab the output of a source and stuff it in in a div.  In previous posts you can see what I've been using for a long time, but I wanted to make a function I wouldn't have to edit every time I used it in a project.

Here's what I've got right now, but I haven't actually used in a project yet.  As far as I can tell, it works fine in IE6, IE8beta, FF2, FF3, Chrome, Safari...

Update:  This function is now used for reloading the CAPTCHA in this blog.

 


function doAjaxSrc2Id(ajaxsrc,ajaxtargetid) {
  var xmlHttp = null;
  if (window.XMLHttpRequest) {
    xmlHttp = new XMLHttpRequest();
  }
  else if (window.ActiveXObject) {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  if (xmlHttp == null) {
    alert ("Browser does not support HTTP Request");
    return;
  }
  xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
      document.getElementById(ajaxtargetid).innerHTML = xmlHttp.responseText;
    }
  }
  xmlHttp.open("GET",ajaxsrc,true);
  xmlHttp.send(null);
}
 


This is what I've been using for a long time:

 


var xmlHttp;
function doRequest() {
  xmlHttp = GetXmlHttpObject();
  if (xmlHttp == null) {
  alert ("Browser does not support HTTP Request");
  return;
  }
  var url = <souce url I have to edit every time I want to use this thing>;
  xmlHttp.onreadystatechange = stateChanged;
  xmlHttp.open("GET",url,true);
  xmlHttp.send(null);
}//end doRequest()

function stateChanged() {
  if (xmlHttp.readyState == 4 || xmlHttp.readyState == "complete") {
  document.getElementById(<target id I have to edit every time I want to use this thing>).innerHTML = xmlHttp.responseText;
  }
}//end stateChanged()

function GetXmlHttpObject() {
  var objXMLHttp = null;
  if (window.XMLHttpRequest) {
    objXMLHttp = new XMLHttpRequest();
  }
  else if (window.ActiveXObject) {
    objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  return objXMLHttp;
}//end GetXmlHttpObject()
 




By the way, I looked into the "Microsoft.XMLHTTP" as opposed to more modern ways.  Yes, another big, boring waste of research time.  So far, this is supported up to the latest versions of IE (or rather, the latest msxmlxx.dll; at least, I think they're all named that), but from IE7 on there is native support for the window.XMLHttpRequest, so it's unlikely the ActiveXObject would be used in anything newer than IE6 anyway.

Also by the way, I don't think I've ever seen xmlHttp.readyState to return "complete" instead of a number.  But, along with the KISS principle, "if it ain't broke, don't fix it!"

 

last edited on February 16th, 2009 at 1:36 AM

Comments

No Comments Here. Add yours below!

Add your comment

Name:
Email: (Will not be displayed - Privacy policy)
Website:
Comments:
  random image I can't read it!
Give me a different one!
Verify Post: Input the text from the image above to verify this post (helps prevent spam)
 

« Blog Home

Comments

She stood up.  “Professional?  Ha!  My father used to say, you have to be able to tell a tracheotomist from a cutthroat.  Well, I can.”
Claire, Artifact,Gregory Benford