ASP.NET AJAX: Client-side event viewer

Introduction

Often times when an ASP.NET developer is first learning about the page lifecycle, he puts together a simple application that displays the raised events on the page. This widespread technique helps him understand the order in which the events occur, the arguments that are passed along, and ultimately what can and cannot be accomplished during each event.

In ASP.NET AJAX, a page lifecyle, similar to the one that occurs on the server; takes place on the client as well. By leveraging the client-side events raised by the Application class and the PageRequestManager, we can take more control of the application during partial-page updates. The figure below illustrates the events that occur within the browser when a successful partial postback is applied.

Partial postback events

Client-Side Event Viewer

To gain a deeper understanding of the client-side event model in ASP.NET AJAX, I've put together an application that exposes the client-side steps that occur during partial postbacks. In addition, the example demonstrates:

  • Canceling a postback request
  • Aborting a postback request
  • Client-side error handling
  • Visual feedback for long postbacks (similar to the UpdateProgress control)

Here is a snapshot of a portion of the application after a typical postback:
Client event viewer

Click here to download the source code and let me know what you think.

Published Sunday, March 25, 2007 11:57 PM by davidbarkol
Filed under: , ,

Comments

# Interesting finding - 03/26/2007 « Another .NET Blog

Monday, March 26, 2007 2:29 PM by Interesting finding - 03/26/2007 « Another .NET Blog

PingBack from http://liangwu.wordpress.com/2007/03/26/interesting-finding-03262007/

# re: ASP.NET AJAX: Client-side event viewer

Friday, June 08, 2007 5:30 AM by Munish

l know that AJAX life cycle

# 【收藏】本周ASP.NET英文技术文章推荐[03/25 - 03/31]

Thursday, November 22, 2007 10:49 PM by Jacky_xu

摘要

本期共有6篇文章: ASP.NETAJAX:客户端事件查看器

JavaScript和.NET中的JavaScript对象标记(JSON)介绍

在ASP.NET2.0应用程序...

# re: ASP.NET AJAX: Client-side event viewer

Friday, January 18, 2008 3:06 AM by Rupesh kumar Tiwari

Great one! it depicts the life cylcle in a vivid way.

# re: ASP.NET AJAX: Client-side event viewer

Monday, April 21, 2008 2:14 AM by Don Green

Do AJAX partial page updates trigger the Page_Load() of the containing page, and if so, is there a "PostBack" or "PartialPostBack" or similar property to check for?

I want to do some stuff in asp/C#, that I can't do in the EndRequestHandler, and only do it for the AJAX partial page load, not the full page load (not PostBack).

# re: ASP.NET AJAX: Client-side event viewer

Thursday, April 24, 2008 7:41 AM by Arnis Lapsa

Thank you very much...

# re: ASP.NET AJAX: Client-side event viewer

Monday, April 28, 2008 12:29 AM by davidbarkol

Don, as you suspected the page lifecycle does occur and there is a way to detect if it is a postback or partial postback. See: www.asp.net/.../P_System_Web_UI_ScriptManager_IsInAsyncPostBack.aspx

# re: ASP.NET AJAX: Client-side event viewer

Thursday, May 29, 2008 4:21 PM by Khai Wan

Thanks for this example, David. It is very helpful - simple yet concise.

Leave a Comment

(required) 
(required) 
(optional)
(required)