Asp.net ajax 生命周期DEMO

<%@ Page Language="C#" %>
<!DOCTYPE Html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html XMLns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Client Event Example</title>
    <style type="text/Css">
    #OuterPanel { 600px; height: 200px; border: 2px solid blue; }
    #NestedPanel { 596px; height: 60px; border: 2px solid green;
                   margin-left:5 px; margin-right:5px; margin-bottom:5px;}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Scripts>
           <asp:ScriptReference Path="ClientEventTest.js" />
        </Scripts>
        </asp:ScriptManager>
        <asp:UpdatePanel ID="OuterPanel" UpdateMode="Conditional" runat="server">
        <ContentTemplate>
            Postbacks from inside the outer panel and inner panel are
            asynchronous postbacks. PRM = Sys.WebForms.PageRequestManager. APP = Sys.Application.

            <br /><br />
            <asp:Button ID="OPButton1" Text="Outer Panel Button" runat="server" />
            Last updated on
            <%= DateTime.Now.ToString() %>
            <br /><br />

            <asp:UpdatePanel ID="NestedPanel" UpdateMode="Conditional" runat="server">
            <ContentTemplate>
                <asp:Button ID="NPButton1" Text="Nested Panel 1 Button" runat="server" />

                Last updated on
                <%= DateTime.Now.ToString() %>
                <br />
            </ContentTemplate>
            </asp:UpdatePanel>
        </ContentTemplate>
        </asp:UpdatePanel>

        <asp:Button ID="FullPostBack" runat="server" Text="Full Postback" />
        <a href="http://www.microsoft.com">Test Window Unload</a>
        <br />
        <span id="ClientEvents"></span>
    </div>
<script type="text/javascript">
// Hook up Application event handlers.
var app = Sys.Application;
app.add_load(ApplicationLoad);
app.add_init(ApplicationInit);
app.add_disposing(ApplicationDisposing);
app.add_unload(ApplicationUnload);

// Application event handlers for component developers.
function ApplicationInit(sender) {
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (!prm.get_isInAsyncPostBack())
{
      prm.add_initializeRequest(InitializeRequest);
      prm.add_beginRequest(BeginRequest);
      prm.add_pageLoading(PageLoading);
      prm.add_pageLoaded(PageLoaded);
      prm.add_endRequest(EndRequest);
}
$get('ClientEvents').innerHTML += "APP:: Application init. <br/>";
}
function ApplicationLoad(sender, args) {
$get('ClientEvents').innerHTML += "APP:: Application load. ";
$get('ClientEvents').innerHTML += "(isPartialLoad = " + args.get_isPartialLoad() + ")<br/>";
}
function ApplicationUnload(sender) {
alert('APP:: Application unload.');
}
function ApplicationDisposing(sender) {
$get('ClientEvents').innerHTML += "APP:: Application disposing. <br/>";

}
// Application event handlers for page developers.
function pageLoad() {
$get('ClientEvents').innerHTML += "PAGE:: Load.<br/>";
}

function pageUnload() {
alert('Page:: Page unload.');
}

// PageRequestManager event handlers.
function InitializeRequest(sender, args) {
$get('ClientEvents').innerHTML += "<hr/>";
$get('ClientEvents').innerHTML += "PRM:: Initializing async request.<br/>";
}
function BeginRequest(sender, args) {
$get('ClientEvents').innerHTML += "PRM:: Begin processing async request.<br/>";
}
function PageLoading(sender, args) {
$get('ClientEvents').innerHTML += "PRM:: Loading results of async request.<br/>";
var updatedPanels = printArray("PanelsUpdating", args.get_panelsUpdating());
var deletedPanels = printArray("PanelsDeleting", args.get_panelsDeleting());

var message = "-->" + updatedPanels + "<br/>-->" + deletedPanels + "<br/>";

document.getElementById("ClientEvents").innerHTML += message;
}
function PageLoaded(sender, args) {
$get('ClientEvents').innerHTML += "PRM:: Finished loading results of async request.<br/>";
var updatedPanels = printArray("PanelsUpdated", args.get_panelsUpdated());
var createdPanels = printArray("PaneslCreated", args.get_panelsCreated());

var message = "-->" + updatedPanels + "<br/>-->" + createdPanels + "<br/>";

document.getElementById("ClientEvents").innerHTML += message;
}
function EndRequest(sender, args) {
$get('ClientEvents').innerHTML += "PRM:: End of async request.<br/>";
}

// Helper functions.
function Clear()
{
$get('ClientEvents').innerHTML = "";
}
function printArray(name, arr)
{
    var panels = name + '=' + arr.length;
    if(arr.length > 0)
    {
        panels += "(";
        for(var i = 0; i < arr.length; i++)
        {
            panels += arr[i].id + ',';
        }
        panels = panels.substring(0, panels.length - 1);
        panels += ")";
    }
    return panels;
}
</script>
    </form>
</body>
</html>