25 January 2008

Asynchronous JavaScript Part 3 - Using ADIJ

In part 1 and part 2 of this series on asynchronous JavaScript techniques, I have introduced the ADIJ object. Now, I will demonstrate just how easy it is to use the object with an extremely simple code example.

var myAdij = new J2.ADIJ( {

URL: "/getADIJdata.json",

onSuccess: successHandler

} );

myAdij.send();

function successHandler(myAdij) {

var jsonData = myAdij.getResponseText();

....

}

In this example, I create a variable called myAdij which is set to a new instance of the ADIJ object. I pass an object literal of values into the constructor of the ADIJ object containing the URL which I wish to request and the success handler which will get called when the ADIJ object gets a response to this request.

I then call the send method which will send the request.

When the ADIJ object gets its response, successHandler will be called. It will be passed one argument which is a different form of the ADIJ object now containing a method getResponseText which will return the JSON object sent as the response to the ADIJ request.

Once successHandler had finished being executed, the original ADIJ object can be garbage collected by the browser assuming there are no other live references to it.

It is also possible to create and send the ADIJ request in one line of code and without assigning it to a variable. This can be useful in instances when the original ADIJ object will not be needed again.

new J2.ADIJ( {

URL: "/getADIJdata.json",

onSuccess: successHandler

} ).send();


function successHandler(myAdij) {

var jsonData = myAdij.getResponseText();

....

}


Note that the send method is now called in line with the construction of the new ADIJ object.

It is as simple and easy as that! So go, play and enjoy and when this series returns, we will be discussing AJAX and particularly JSquared AJAX.

4 comments:

Neil Mosafi said...

Nice!

So how does ADIJ handle failures? For example, what if the URL provided does not exist, or the server times out, or it sends an invalid response back?

Is there anything you can do to handle that - perhaps a timeout on the client which checks of the callback has been fired within a minute?

ASP.NET Ajax has a successHandler and a failureHandler, maybe something similar could go into this API.

James Norton said...

At the moment, all failures are handled silently.

As you will soon see, JSquared AJAX has failure handling built in with timeouts and other failure types handled.

Eventually I intend to add this to ADIJ as well, but its not top priority for JSquared at present.

Thanks for your comment.

Neil Mosafi said...

Cool sounds good!

Is it possible to keep the interfaces and data structures the same, such that you could essentially silently switch between using AJAX and ADIJ without having to change any of you client code. Something similar to the Factory/Provider pattern in strongly typed OO languages. Now that would be cool!

Then again, I guess AJAX can be used to return XML, JSON, or plain text, whilst ADIJ is only JSON, so maybe they couldn't be compatible? What do you think?

James Norton said...

The two objects do share an interface. They both expect a URL and onSuccess property and they both have getResponseText as a method for getting the response, so at that level they are interchangeable.

However, one needs to be aware of the difference between them as AJAX requests are domain locked and are more secure than ADIJ requests. Part 1 of this series discussed some of the issues with ADIJ and security.