Matt RaibleMatt Raible is a Java Champion and Developer Advocate at Okta. developer.okta.com

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: Angular, Bootstrap, and Spring Boot. All of these frameworks are wrapped up in an easy-to-use project called JHipster.

This book shows you how to build an app with JHipster, and guides you through the plethora of tools, techniques and options you can use. Furthermore, it explains the UI and API building blocks so you understand the underpinnings of your great application.

For book updates, follow @jhipster-book on Twitter.

10+ YEARS


Over 10 years ago, I wrote my first blog post. Since then, I've authored books, had kids, traveled the world, found Trish and blogged about it all.

XmlHttpRequest

Dave quotes it, Charles writes it. XmlHttpRequest is the topic at hand and how it will help us build the next generation of web UIs. I've used Brent Ashley's JSRS Library to do some fancy UI work (one drop-down populates another) last year. It worked well in combination with Erik Hatcher's articles: Remote scripting using a servlet and Sending rich messages between client and server using asynchronous messaging. The project was AppFuse based, so I have the code if someone really wants it.

An example of XmlHttpRequest is in Roller itself - in the twisty comments you see on this site. For those who have used them, you probably know they're somewhat buggy. With all this talk of XmlHttpRequest, maybe it's high-time to revisit Roller's implemenentation and see if the technology has gotten any better. In reality, I know it hasn't - it's the browsers that are the problem and there hasn't been an update to IE in quite some time. My code could probably use some work though. If you want to dig in and check it out, here's the xmlextras.js that does the heavy lifting and comment-specific JavaScript.

After looking at this code this morning, it looks like there's different methods being used for the different browsers.

/////////////////////////////////////////////////////////////////////
//// XML Document loading

function loadXMLDocument(aURL, aCallback)
{ 
  gMediaCallback = aCallback;
  
  if (window.ActiveXObject) {
    // Internet Explorer XML loading syntax
    gMediaDoc = new ActiveXObject(getControlPrefix() + ".XmlDom");
    gMediaDoc.onreadystatechange = onMediaReadyStateChange;
    gMediaDoc.async = true;
    gMediaDoc.load(aURL);
  } else {
    // Mozilla XML loading syntax
    gMediaDoc = document.implementation.createDocument("", "", null);
	var xmlHttp = new XMLHttpRequest();
    xmlHttp.overrideMimeType("text/xml");
	xmlHttp.open("GET", aURL, false);
	xmlHttp.send(null);
    gMediaDoc.loadXML(xmlHttp.responseXML.xml);
    onMediaLoaded();
  }
}

I wonder if there's a common way that can be used for both browsers? BTW, 99% of the code for these comments was borrowed from Joe Hewitt.

Later: Another article covering this technology: Using the XML HTTP Request object. Hat tip to Carl.

Posted in Roller at Dec 11 2004, 09:29:09 AM MST 13 Comments
Comments:

For more XmlHttpRequest code by all means take a look at our JavaScript library for doing Streamlets which is asynchronous messaging in the browser with ActiveMQ on the back end... http://activemq.codehaus.org/Streamlets

Posted by James Strachan on December 12, 2004 at 02:08 AM MST #

Matt, it occurs to me that dynamically populating drop-downs could be very common use for this technology; See <a href="http://www.jlamp.com/blog/2004/12/12/1102893719000.html ">this blog entry on my site.

Also, here's another useful article which has more info on Safari.

Posted by Will on December 12, 2004 at 05:56 PM MST #

Ummm.. never mind about the article link, that was in your blog already. oops.

Posted by Will on December 12, 2004 at 08:48 PM MST #

Matt, it isn't any tremendous, but I did hack together something for a project I have been working on that gives an HttpClient feel to the XMLHttpRequest object. Check it out on my [wiki|http://www.mojavelinux.com/wiki/doku.php?id=scriptsandbox#httpclient.js].

Posted by Dan Allen on December 13, 2004 at 07:28 AM MST #

Hmmm, that syntax didn't seem to create a link. Let's try again. http://www.mojavelinux.com/wiki/doku.php?id=scriptsandbox#httpclient.js

Posted by Dan Allen on December 13, 2004 at 07:29 AM MST #

Actually, I am realizing that this javascript-based request is spreading like a firestorm around the web. A wiki page has been created that is dedicated to the new LiveSearch showing up on many blogs, which shows results as you type. In fact, even google has jumped on board with a new feature called Suggest. Try typing the letter "f". You may be suprised what you find!

Posted by Dan Allen on December 13, 2004 at 07:43 AM MST #

while the xmlhttprequest object is great for those remote procedure call-type look-ups, manipulating it is a PITA. I'm having a hell of a time doing a deep copy (or clone) of the nodes to another (native) xml doc (ie: a data island). the problem seems to be that the xmlhttprequest xml is an activeX (or mozilla) object whereas xml docs created by Javascript are native DOM objects. Chalk'n'cheese. this has been some help: http://xmljs.sourceforge.net/ (X-Platform XML Parsing in JavaScript) If I can crack the copying of child nodes from xmlhttprequest docs to a master xml doc, I'll post it up. but be warned - manip (more than just read/display) of the xml doc is not as easy as it should be. if anyone has any tips, feel free, etc. thanx barry.b

Posted by barry.b on December 13, 2004 at 09:55 AM MST #

one more

http://www.theserverside.com/news/thread.tss?thread_id=30520

Posted by Alexandre Jacques on December 13, 2004 at 01:45 PM MST #

Matt, can I have your code used in combination with Brent Ashley's JSRS library? BTW, Sarissa uses xmlhttprequest as well.

Posted by Eu Gene Lim on December 14, 2004 at 07:54 PM MST #

Eu Gene - if you enter an enhancement request for AppFuse (and an example to implement), I'll try to add it for the next release.

Posted by Matt Raible on December 14, 2004 at 10:40 PM MST #

On a related note, you might want to take a look at Direct Web Remoting on dev.java.net. Although it is in an early phase, DWR allows client-side javascript to invoke methods in server-side classes, provided that parameters are all convertible to/from strings.

Posted by Greg on December 19, 2004 at 02:08 AM MST #

xmlhttprequest, been using it for almost a year now and works great!

Posted by Harold Neiper on December 22, 2004 at 12:48 PM MST #

is there a way i can use ajax in mobile user using the same function, its giving me a null value

heres my code:

function getXMLHTTP(){
  var A = null;

  try{
    A = new ActiveXObject("Msxml2.XMLHTTP");

  }catch(e){
    try{
      A = new ActiveXObject("Microsoft.XMLHTTP");
      
    } catch(oc){
      A = null;
    }
  }
  
  if(!A && typeof XMLHttpRequest != "undefined") {
    A = new XMLHttpRequest();
  
  }
  
  return A;
}

Posted by Glenn on March 07, 2007 at 03:07 AM MST #

Post a Comment:
  • HTML Syntax: Allowed