CODEWITHSUNDEEP
javascriptajaxextjsxmlhttprequest
John Hall
John Hall

Reputation: 1346

ExtJS 4.1 - Handling XHR's in Sequence without using Synchronous Requests

My application is backed by a complex database architecture, heavy in foreign key restraints which result in my JavaScript being riddled with callback handlers. For a single action, such as creating a new order, there may be as many as three XHR's required to submit all the necessary data for processing.

Currently, I am handling this in what I feel is a rather ungraceful or at the very least, a bit sloppy means...

/** -- PSEUDO CODE -- */
myOrder.save({
    success: function()
    {
         /** This request handled inserting the main attributes of the model
             into the database, which means it is safe to fire off additional
             requests */
         myOrderContents.store.sync({
                success: function()
                {
                    /** Possibly fire another request here, that is dependent on
                        the first two requests returning successfully, or maybe
                        execute code that is also dependent on these requests.
                      */
                }
         });
    },
    failure: function()
    {
    /** Handle Failure Here */
    }
});

I realize another viable approach would be something along the lines of all requests calling one callback method, which would then only execute a certain chunk of code....

myOrder.save({callback: executeAfterRequests});
myOrderContents.store.sync({callback: executeAfterRequests});
myOtherObject.save({callback: executeAfterRequests});

executeAfterRequests: function()
{
    if(requestA.isComplete() && requestB.isComplete() && requestC.isComplete())
    {
    /** Execute some code after all requests have been completed... */
    }
}

Given that ExtJS dev's are strongly opposed to synchronous request, is my best bet here to extend the base AJAX class and implement a Queue? Or, accept the nature of AJAX and continue on my merry way with nested success functionality?

Thank you for your input.

Upvotes: 0

Views: 666

Answers (2)

dbrin
dbrin

Reputation: 15673

Why not send all of the needed data to the server together? You can create your records in steps on the server and return when all is done. There are examples out there with form wizards that can take users through a long process of collecting data screen by screen but submits all of it at the end.

Upvotes: 1

AndreKR
AndreKR

Reputation: 33678

Yes, I'd go with a queue helper that you can put your functions in and that wraps and executes them one after the other.

Probably you should look into the available tools and see if one of them suits your need, apparently there are several of them. Unfortunately, I think, none of them became accepted as the standard technique yet.

Upvotes: 0

Related Questions