pf » AJAX Presentation Outline

if (window.XMLHttpRequest) {
       var req = new XMLHttpRequest();
       req.onreadystatechange = requestStateHandler;
       req.open("GET", "/somefile.xml", true);
       req.send("");
}

function requestStateHandler() {
 if (req.readyState == 4) { //response ready
       alert(req.statusText);
 }
}

var req;

function loadXMLDoc(url) {
	req = false;
    // branch for native XMLHttpRequest object
    if(window.XMLHttpRequest) {
    	try {
			req = new XMLHttpRequest();
        } catch(e) {
			req = false;
        }
    // branch for IE/Windows ActiveX version
    } else if(window.ActiveXObject) {
       	try {
        	req = new ActiveXObject("Msxml2.XMLHTTP");
      	} catch(e) {
        	try {
          		req = new ActiveXObject("Microsoft.XMLHTTP");
        	} catch(e) {
          		req = false;
        	}
		}
    }
	if(req) {
		req.onreadystatechange = processReqChange;
		req.open("GET", url, true);
		req.send("");
	}
}

for ColdFusion there is also ajaxCFC, which is component based. Check http://www.robgonda.com/blog/projects/ajaxcfc for more details

Two comments. 1. If you can understand how AJAX works using the 10 or so essential lines of Javascript then don't bother with frameworks or libraries since it adds functions that you probably will never use and can produce 10x more Javascript code, plus extra back-end CF code which has a performance impact (end users and servers). It's easier to understand the basic Javascript httprequest object and code it yourself than use the AJAX libraries. (I know some will disagree, but this is my opinion).

2. I've found sending Javascript arrays rather than XML from CF to the browser faster and easier. Less code and Javascript is brilliant for working with arrays, especially if you use short notation to create them which CF can do with minimal code. e.g. var myArray=[ ["value","key"], ["value","key"] ];

Actually you can perform AJAX Get's cross domains however "POST" functions are limited to a single domain. The IFRAME technique is not limited by cross-domain issues and using IFRAMEs can be faster at runtime due to the ability to manipulate raw data more easily between CF and JavaScript, IMHO.

You can read my blog via http://rayhorn.contentopia.net/blog

Indeed, I strongly disagree. Yes, you can perform an ajax call with a few JavaScript lines, but the frameworks standardize process, and allow for easily adapt to different scenarios. For instance I can quickly change my calls from asynch to synch, and from get to post& I can also serialize all my complex objects in the background and make them natively accessible to ColdFusion. Perhaps, it does add a few additional lines of code, which 33k of code & not a big deal; furthermore, after it has been downloaded once it gets cached anyways.

As for the ColdFusion side, extending an base class makes it extremely easy for the CF developer. All he has to do is write a function just as if he would write it for a CF page& nothing changes& the ajax call will do the rest. For your second comment, I concur. ajaxCFC sends JavaScript arrays back to the browser instead of XML, and its automatically picked up by the call-back function; not in key pairs like you mentioned, but real arrays and structures& I hate to loop over an array and check for a key pair& there are more efficient ways of handling recordsets.

As far a cross domain, get vebs do work. I would personally stay away from the iframe method & I used that about 5 or 6 years ago & Its no longer needed.

You can always use XMLHttpRequest (SOAPCall in Mozilla) for calling web services. In my opinion this is more flexible than few simple functions written for example in CF an JS on client-side.

I love Mozilla and FF is my preferred browser& but I know for fact that only about 5% of the users that browse my site are using it; so its not a viable option. Commercial sites have to satisfy all type of users, even Safari, lol & Thats another advantage of frameworks, they make your code compatible with most browsers automatically& it takes that load of your back.

Out of curiosity Rob, why the comment on Safari? Seems to have far less issues with javascript, css, and yes AJAX, etc. than the bug-ridden wonder of IE/Win - although it can get a bit unstable if left running for days and days and using AJAX heavy sites.

Not giant martketshare of course, but most Mac users I know are using Safari if they've made the OS X transition.

Dan, I suspected someone would ask. I'm just not a big fan of Safari (personal preference); I actually find it (version 1.3) extremely buggy with both JS and CSS. I know most of the ppl who transition to Mac use Safari 1.3, because it's the default browser & but it also comes with IE 5.2, which is even worse.

Mac's do not have a huge marketshare, although I work with dozens of ad agencies, and they all use them& so I definitely have to accommodate for that.

However, I disagree with you on IE& I do not like IE, especially from a developer stand point& it's _intelligence_ auto fixes bad css and bad JS syntax, making it work only on IE and not in any other browser & but at least it works & Safari on the other hand gives me a headache every time I need to ensure that the L&F will look the same as IE or FF.

Back to AJAX and Safari & Safari requires some tweaking to work properly & it auto encodes XML request packets, so you need to know to decode them before using them in the server side & and then DOM & I hear Safari 2.0 fixed some issues, but again, 1.3 is missing a vast amount of functionality, making it extremely more difficult to develop nice Web 2.0 applications.

Rob - Thanks for responding - and just curious on your thoughts re: Safari.

I don't have nearly the experience that you do in this realm, so wouldn't dream of arguing the finer points of the good, bad and ugly of the many ways in which the plethora of browsers out there wreak havoc, making coding by multiple exceptions or lowest common denomiator the norm. Sounds like we're in agreement in general there in any case. None of these browsers is perfect, eh?

On the AJAX front, I definitely agree that IE/Win has much more going for it, since Microsoft did after all invent the XMLHttpRequest Object (an overnite sensation after only 5, 7 years?) - but the giant stack of bugs relating to CSS, HTML, XHTML that everyone is forced to learn to get even basic pages/sites into reasonable shape is enough to drive one to drink! My experience thus far is that Safari tends to act much like Firefox on the display side, which tends to simplify at least SOME of the work.

Layering on top of those issues, the fun in dealing with AJAX/Web 2.0 functionality - I heartily applaud you and the other folks that are blazing a path here and sorting out the bugs to create such a more dynamic and fluid web experience. 2005 has been a heck of year for this, eh? Looking forward to 2006.

Looking back at your last comment incidentally - sites that I have worked on, or other companies that I have asked about traffic patterns seem to register more Safari 2.x users than prior versions, for the Mac traffic that they are getting.

Sounds as though the users for your sites/projects haven't leashed themselves a Tiger yet - a shame for them to miss out on the better Safari experience, speed bump (every version of OS X is faster than the last - what a concept) and far more solid OS in Tiger.

Cheers, Dan

(ah, and to make sure I'm not hallucinating - do you have a book on AJAX out? If so, I'm not finding it via Google, Amazon, etc.)

Dan, we're mostly on the same page indeed, those were my personal thoughts of Safari; I know many people who use it and have no complains, but if I had a Mac, I would definitely use FF. I have two Macs at the office that I use to QA our sites before launching them.

I wasn't talking about some specific users; I am CTO for iChameleon Group (www.ichameleongroup.com) and I look at stats for all our major sites. For example, these stats come from a site that I cannot disclose, with about 500,000 unique hits a month.

83% IE 10% FF 3.8% Safari

About 50% are 1.3 and 50% 2.0 ... so about 1.9% of my average users use Safari 1.3, lol...

And if I look at my international sites, i.e. for South America, it's actually 0%.

Anyways, back to the point ... I just ran into a problem yesterday ... I wrote a form validation tool in ColdFusion to mimic Flex 2.0 functionality, and I found that it works perfectly in IE, FF, Opera, Netscape, but Safari does not want to color the borders of the required inputs; small CSS compatibility issue. I also had issues auto resizing iframes... and huge issues with Flash ... especially performance, and streaming flv's, but those two are Macs in general ...

AJAX for Safari works perfectly after I decode the URL string in the server side.

Btw, thanks for the complements... but I didn't write a book ? not yet at least --. I wrote some articles for sys-con, I am speaking at a couple of seminars, a webcast for Reuters, and developed a ColdFusion-Ajax framework :) ... but I still haven't had time for a full book... good idea though, I will consider it.

Check out (sorry for the spam) :) http://coldfusion.sys-con.com/read/138966.htm http://coldfusion.sys-con.com/read/154244.htm http://www.ajaxseminar.com/ http://www.robgonda.com/blog/projects/ajaxcfc/

oh yes... I am so glad Microsoft publicly announced they ceased support for IE for Macs: http://www.microsoft.com/mac/products/internetexplorer/internetexplorer.aspx?id=internetexplorer

Best,

-Rob

Rob - Thanks for all the details, always interesting to hear specifics about real-life deployments.

I have not spoken to the Safari team, but you might want to get in touch with Dave Hyatt and that crew (http://webkit.opendarwin.org/blog/) to report the issues you've mentioned. I do agree though, for some reason Flash can have very poor performance characteristics on Macs.

Having peered a fair amount into the book writing/publishing process (several of our people at Delphi Group - http://www.delphigroup.com/ - have written books over the years), I wouldn't necessarily recommend doing it - particularly for technical writing, it's quite a process to go through. Be prepared to lose whatever spare time and previously occupied time you had to the process! But Fame (perhaps) and fortune (not quite) are yours to be had! :)

Articles, seminars, webcasts - much easier to make progress on in reasonable amounts of time and effort...

If all of these technologies just worked as they would, what would we all do with our spare time?

Great chatting with you here - and I'm sure we'll run into each other here or elsewhere in the "blogosphere" - keep up the good work.

Cheers, Dan

Just as a heads up ... AJAX is available on:

IE 5+ Mozilla (all) Netscape 7+ Safari 1.2+ Opera 7.6+

That's about 90% or more user-base for most websites.

You can also download an AJAX-on-steroids from http://rayhorn.contentopia.net/blog straight from the Rabid CF Developer himself.

Ray, with all do respect, that framework is on anything but steroids... it says it does get, post, wddx, and that it is cross browser; but that is expected from any framework and there must be at least 100 that do all that and more. What about debugging or encryption? I'm sorry, but I'm not sold.

Check out what people think about Ray Horn: http://www.robgonda.com/blog/index.cfm/2006/1/17/CF-developer-with-30-years-of-horrible-experience http://clearsoftware.net/index.cfm?mode=entry&entry=D87EDD28-E081-2BAC-69B923575744C5F4 http://dynamicflash.com/2006/01/how-not-to-develop-any-software-let-alone-open-source/

You have a typo on the page.. in the MSIE activex explanation, you have this:

req = new ActiveXOjbect("Microsoft.XMLHTTP");

(object is spelled "ojbect") which won't work when you cut and paste the line as I did. :)

nicer

Gary, I agree with your stance on frameworks which is why I came up with a much smaller Ajax API called JSMX. It gives the advantage of standardizing your calls without the framework "bloat". It is definitely more then 10 lines of code but is confined to just one JavaScript file. easy to use and implement. No Server Side includes needed other then what you write yourself for each call. You should check it out at http://www.lalabird.com

hi all,

Please give me some DOCUMENT regarding AJAX, it will be help full for me

i need a complete introduction in jsp

hey there.. can u send me the copy of the presentation. if u wish!