Recent Weblogs

Links I like

Ajax.Application.Base

Ajax.Application.Base is a javascript class for which to extend your classes from. It handles the basics of sending ajax requests. I noticed pretty early on when working with prototype that my onFailure and onException handlers were pretty similar throughout all calls. The only thing that changed was the onComplete. I have been working a lot with Firebug so it has some friendly code to just log errors. If you're working with prototype it'd be a great idea to get firebug

Ajax.Application.Base can be thought of as an abstract class, we can't define that in the syntax but it has no initialize function(constructor). 

var myApp = new Ajax.Application.Base();// won't work.
This class is an abstract from which you extend from 
Object.extend(Object.extend(myClass.prototype, Ajax.Application.Base.prototype), { initialize : function(){ //oh boy, i am concrete } });
Now my Class has inherited all functions of Ajax.Application.Base and can now send its own requests from an internal method, easily accessed via this.sendRequest().

Send Request

sendRequest receives two parameters, the first being the dto or parameters of the Ajax.Request that is going to be created. This can be a hash object { hi : "there" } or it can be a query string "hi=there&you=gohome". The second is the call back function which should be executed when the request has finished.

The URL Property

Ajax.Application.Base utilizes a url property which must be set at some point before a request is made, this is the url that will be executed for all requests, all subclasses must inherit a url property for the Base class functions to work.

The three functions of an Ajax request

  • onComplete
  • onFailure
  • onException
The Ajax.Application.Base class has handlers for each of these three functions. The advantages of doing it this way is that all of your application's requests go through a single referenced function (Not a bottle neck) but as a gateway which all data must pass through, a lot of times I've been able to easily handle invalid character issues with the server scripts by running formatting functions on the data before it is sent. To run extra logic in the responder function you only need to override the receiveRequest function. 

/**
 * @contributor Matthew Foster
 * @date 		February 4th 2007
 * @purpose 	This class should be considered an "abstract" it is never intended to be a concrete class, notice there is no initialize function.
 *				This class is intended to be extended from, allowing an overwritable yet base functions for processing ajax requests.  The proposed advantage to this structure
 *				Is that during debugging all of your requests are being processed in the same area, thus allowing an easier target for reviewing ajax data.  As well as handling
 *				more of what I believe to be the monotoneous routines involved in sending ajax requests.
 */			
Ajax.Application = {}

Ajax.Application.Base = Class.create(); 
	
Object.extend(Ajax.Application.Base.prototype,
                {
                    
                    sendRequest : function(dto, cb){
                        var p = "";
                        
                        if(typeof dto == "object")
                            p = $H(dto).toQueryString();
                        else if(typeof dto == "string")
                            p = dto;
                        else
                            throw { message : "object sent to sendRequest was invalid type.  Type = " +typeof dto };
                            
                        
                        
                        new Ajax.Request(this.url,
                                            {
                                                parameters   : p,
                                                onComplete   : this.receiveRequest.bind(this, cb),
                                                onFailure    : this.ajaxFailure.bind(this),
                                                onException  : this.ajaxException.bind(this)
                                            }
                                        );                    
                    },
                    
                    receiveRequest : function(cb, eAja){
                        
                        cb(eAja);
                                
                    },
                    ajaxFailure : function(){
                        if(typeof console == "object")
                            console.log("Ajax Request failed args = %o ", arguments);
                        else
                            alert("Ajax request has failed. Application integrity has been compromised.");
                    },
                    ajaxException : function(){
                        
                        if(typeof console == "object")
                            console.log("ajax exception occured args = %o", arguments);
                        
                        
                    }
                
                
                }
    );

Comments

April 30, 2008Film izle

Thank you very much.

April 30, 2008Oyun oyna

Thanks a lot

June 15, 2008Alex

How do you get the response I have this
function ajaxCall(){
Page = Class.create();
Page = Object.extend(Object.extend(Page.prototype, Ajax.Application.prototype), {
initialize : function(){}
}
);
Page.url = "mysql.php";
Page.sendRequest("hi=there",response());
function response(){
alert('got here');

}
}

June 30, 2008Voyance

Thank you for your invaluable help
this information will myself very useful

July 01, 2008merde

Thank you very much.

July 10, 2008Voyance gratuite

These are very interesting information. Thank you for having published.

July 12, 2008salope

You are doing a great and good work ! Thanks

July 18, 2008voyance

Very good article, Thanks for all !

July 21, 2008ilahiler

These are very interesting information. Thank you for having published.s

Name
Site
Comment