ASP.NET AJAX Extensions: UpdatePanel and ScriptManager controls


PartialPageRefresh.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PartialPageRefresh.aspx.cs" Inherits="WebDemo01.PartialPageRefresh" %>


<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
    <title>AJAX Partial Update</title>
</head>

<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>

            <asp:Panel ID="Panel1" runat="server" BackColor="#ffffcc"                      BorderColor="DarkRed" BorderStyle="Double">
                <asp:Label ID="lblMsg" runat="server">
                 Outer Frame</asp:Label>
                <br />
                <br />
                <asp:UpdatePanel runat="server" ID="Up1"                                        UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:Panel ID="Panel2" runat="server"                                        BackColor="DeepSkyBlue" 
                          BorderColor="DarkBlue" BorderStyle="Solid">
                          <asp:Label ID="label1" runat="server">
                           Inner Frame1</asp:Label>
                           <br />
                           <asp:Button ID="btnParUp1" runat="server"                                 Text="Partial Update1" 
                            OnClick="btnParUp1_Click" />
                        </asp:Panel>
                    </ContentTemplate>
                </asp:UpdatePanel>

                <br />
                <asp:UpdatePanel runat="server" ID="Up2"                                      UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:Panel ID="Panel3" runat="server"                                       BackColor="DeepSkyBlue" 
                         BorderColor="DarkBlue" BorderStyle="Solid">
                         <asp:Label ID="label2" runat="server">
                          Inner Frame2</asp:Label>
                          <br />
                          <asp:Button ID="btnParUp2" 
                           runat="server" Text="Partial Update2"                                     OnClick="btnParUp2_Click" />
                        </asp:Panel>
                    </ContentTemplate>
                </asp:UpdatePanel>
                <br />
                <asp:Button ID="btnPage" runat="server" 
                 Text="Full Update" OnClick="btnPage_Click" />
            </asp:Panel>
        </div>
    </form>
</body>

</html>


PartialPageRefresh.aspx.cs

using System;

namespace WebDemo01
{
    public partial class PartialPageRefresh : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string time = DateTime.Now.ToString();
            lblMsg.Text = time;
            label1.Text = time;
            label2.Text = time;
        }
        protected void btnPage_Click(object sender, EventArgs e)
        {
            lblMsg.Text = DateTime.Now.ToString();
        }
        protected void btnParUp1_Click(object sender, EventArgs e)
        {
            label1.Text = DateTime.Now.ToString();
        }
        protected void btnParUp2_Click(object sender, EventArgs e)
        {
            label2.Text = DateTime.Now.ToString();
        }
    }
}

No comments:

Post a Comment