Monday, March 30, 2009

The Page Life Cycle Event Handler Arguments

Introduction

This article is a continuation of the previous article [Ajax Client Page Life Cycle]. This articles explains the Event Arguments and their usage while asynchronous partial page load.

The Page Life Cycle Event Handler Arguments

The Event Arguments are themselves a instance of the object respective to their event handlers. Each arguments gives refernce to other objects, methods and properties which enables us to handle these events in more detail.

Sys.WebForms.InitializeRequestEventArgs Class

The object of this class is used as argument by intializeRequest event of PageRequestManager class. the methods of this object are listed here, where args is the instance of the intializeRequestEventArgs class. the code snippet is also attached below each property for better understanding.

  • args.get_postBackElement();
  • args.get_request();
//add handler to pageInit event Sys.Application.add_init(MyInit);   function MyInit() {     //alert("MyInit added to page request");     //add handler to intializeRequest event     Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(MyIntializeRequest);     //Sys.WebForms.PageRequestManager.getInstance().remove_initializeRequest(MyIntializeRequest); }  //sender gives reference to PageRequestManager object //args gives reference to intializeRequestEventArgs object function MyIntializeRequest(sender,args) {     //assign the refernce of element which intiated the postback to a variable     var ele = args.get_postBackElement();          //change the property of the postback element     args.get_postBackElement().disabled = true;          //sets the display value of postack element     args.get_postBackElement().value = "Page is getting Loaded...";          //cancel the postback initiated     sender.abortPostBack(); } 

Sys.WebForms.BeginRequestEventArgs Class

the object of the class is used by BeginRequest event. this object is more similar to the previous one. the object will be instantiated just before the request sent to the server. the properties and code snippet is listed below.

  • args.get_postBackElement();
  • args.get_request();
//add this of code inside pageInit or pageLoad event Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(MyPageLoading); //Sys.WebForms.PageRequestManager.getInstance().remove_pageLoading(MyPageLoading);  //sender gives reference to PageRequestManager object //args gives reference to BeginRequestEventArgs object function MyBeginRequest(sender,args) {     //we can do the all the actions what we did       //for intializeRequest event. } 

Sys.WebForms.PageLoadingEventArgs Class

the object is used by pageLoading event. this gives refernce for the two collection of update panels used in asynchronous postback. 1. panels Deleted during the post and 2. panels going to be updated. we can get the content of the update panels which are not yet updated here. these panels will get updated after the pageLoaded event. the content of the update panel can be changed here, but it will not reflected in the page when the clycle is finished, because the pageLoaded event will place the new contents in the page, that will e visible to the user at the end.

  • args.get_panelsUpdating();
  • args.get_panelsDeleting();
  • args.get_dataItems();
//this line of code should be inside pageInit or pageLoad event Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(MyPageLoading); //Sys.WebForms.PageRequestManager.getInstance().remove_pageLoading(MyPageLoading);  //sender gives reference to PageRequestManager object //args gives reference to PageLoadingEventArgs object function MyPageLoading(sender,args) {     //the panel collection (going to be updated) count will be displayed.     alert(args.get_panelsUpdating().length);          //the content of the first item from panel collections will be assigned to a variable     var content = args.get_panelsUpdating()[0].innerText;          //display no. of panels is getting deleted during this post back     alert(args.get_panelsDeleting().length) } 

Sys.WebForms.PageLoadedEventArgs Class

pageLoaded event gives refernce to this object. the pageLoading and pageLoaded are more similar. both events will be triggered after Server Page Render event, but the pageLoading event will be triggered before the content gets updated and pageLoaded after content update. the methods are listed below

  • args.get_panelsUpdated();
  • args.get_panelsCreated();
  • args.get_dataItems();
//this line of code should be inside pageInit or pageLoad event Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(MyPageLoaded); //Sys.WebForms.PageRequestManager.getInstance().remove_pageLoaded(MyPageLoaded);  //sender gives reference to PageRequestManager object //args gives reference to PageLoadedEventArgs object function MyPageLoaded(sender,args) {     //the updated panels collection count will be displayed.     alert(args.get_panelsUpdated().length);          //the content of the first item from updated panel collections will be assigned to a variable     var content = args.get_panelsUpdated()[0].innerText;          //display no. of panels created during this post back     alert(args.get_panelsCreated().length) } 

Sys.WebForms.EndRequestEventArgs Class

object of EndRequest event. this is the last event in the asnychronous partial post back. this event will be raised after the postback finshed. responce is a member of this object. the special thing about this object is, it enables us to handle error. the error object will also be a member of this object, if any error occurs during postback otherwise it is null.we can also handle the error and set our own custom values to the error object, that will be poped up when occur occurs. as we have provision to handle the error, the error can also be supressed, so that it will not displayed to user also. this is done by the errorHandled property. if it is set to true then errors are suppressed. the methods are listed below

  • args.get_dataItems();
  • args.get_error();
  • args.get_errorHandled();
  • args.get_response();
//this line of code should be inside pageInit or pageLoad event Sys.WebForms.PageRequestManager.getInstance().add_endRequest(MyEndRequest); //Sys.WebForms.PageRequestManager.getInstance().remove_endRequest(MyEndRequest);  //sender gives reference to PageRequestManager object //args gives reference to EndRequestEventArgs object function MyEndRequest(sender, args) {     //alert("My Request has end");     if (args.get_error() != null)     {         args.set_errorHandled(true);     } } 

Sys.WebForms Exceptions

The exception happens during the asnychronous partial past back are discussed here. the exceptions are dynamically created by the Ajax. the exceptions are listed below...

  • PageRequestManagerParserErrorException
  • PageRequestManagerServerErrorException
  • PageRequestManagerTimeoutErrorException

The ParserErrorException happens when an error occurs in processing response. A situation for this like using Server.Transfer in the partial post back. In this scenario, the request is sent to the server and server is tranfering the request to some other page, where a client in not aware of this. so the expected page response is falied as per the Client, so it throws a error. the same situation can be avoided by Responce.Redirect, because it makes two round trips to the server, also the client is aware of the page redirection.

The ServerErrorException happens for all the unhandled errors happen on the server side code. For example, tring to parse a null to int, assigning value to non instanced object, or similar kind of error raises this exception.

TimeoutException is as the name says, it is thrown when the response is not returned within the specific span of time. The ScriptManager control takes care of these scenarios, we can avoid this by increasing the value of AsyncPostBackTimeout property of ScripManager.

these error can be caught in the endRequest event. the get_error() method can be used to retrive the error object and the name property of the error object gives the full name of the error, and we can handle accordingly. the below code snippet of endRequest event explains this...

function MyEndRequest(sender, args) {     //alert("My Request has end");     var s = sender;     var a = args;     var msg = null;     if (a._error != null)     {         switch (args._error.name)         {             case "Sys.WebForms.PageRequestManagerServerErrorException" :                 msg = "PageRequestManagerServerErrorException";                 break;             case "Sys.WebForms.PageRequestManagerParserErrorException" :                 msg = "PageRequestManagerParserErrorException";                 break;             case "Sys.WebForms.PageRequestManagerTimeoutException" :                 msg = "PageRequestManagerTimeoutException";                 break;         }         args._error.message = "My Custom Error Message " + msg;         args.set_errorHandled(true);     }  } 

Additional Information

The handlers can be removed as the same way we are adding it, the commented line below the add custom event handler, is the code to remove the added custom event handlers. this note applies for the whole article. i have written this way for just for demonstration.

The objects of Ajax are not having properties, they are methods actually, to remember easily, add prefix get_ and set_ before the actual name of member. Also there are lot of members which are exposed directly to the user, they are not restricted. As the javascript doesn't provide that much flexibility towards OOPS, even though it suports to a better extent. these members are similar to the property name with just underscore(_) as prefix to it. we can still have the choice of using it, genarly they are not advising it, but if we are able to understand and do changes, it works fine. as you can see the _error.message is set with a custom value in the code snippet given above.