ASP.NET Tutorial/Ajax/UpdatePanelAnimation

Материал из .Net Framework эксперт
Перейти к: навигация, поиск

Using the UpdatePanelAnimation Control

   <source lang="csharp">

<%@ Page Language="C#" %> <%@ Register TagPrefix="ajax" Namespace="AjaxControlToolkit" 

Assembly="AjaxControlToolkit" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server"> 

   protected void btnSubmit_Click(object sender, EventArgs e)
   {
       System.Threading.Thread.Sleep(2000);
       lblSelectedColor.Text = txtFavoriteColor.Text;
   }

</script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> 

   <title>Show UpdatePanel Animation</title>

</head> <body> 

   <form id="form1" runat="server">

       <asp:ScriptManager ID="ScriptManager1" runat="server" />
       <%-- First Update Panel --%>
       <asp:UpdatePanel ID="up1" runat="server">
       <ContentTemplate>
       <asp:Label
           id="lblFavoriteColor"
           Text="Enter Your Favorite Color:"
           Runat="server" />
       <asp:TextBox
           id="txtFavoriteColor"
           Runat="server" />
       <asp:Button
           id="btnSubmit"
           Text="Submit"
           Runat="server" OnClick="btnSubmit_Click" />
       </ContentTemplate>
       </asp:UpdatePanel>
       <ajax:UpdatePanelAnimationExtender
           id="upae1"
           TargetControlID="up1"
           runat="server">
       <Animations>
           <OnUpdating>
           <Color
               Duration="0.5"
               Fps="20"
               Property="style"
               PropertyKey="backgroundColor"
               StartValue="#FFFFFF"
               EndValue="#FFFF90" />
           </OnUpdating>
           <OnUpdated>
           <Color
               Duration="1"
               Fps="20"
               Property="style"
               PropertyKey="backgroundColor"
               StartValue="#FFFF90"
               EndValue="#FFFFFF" />
           </OnUpdated>
       </Animations>
       </ajax:UpdatePanelAnimationExtender>
       <%-- Second Update Panel --%>
       <asp:UpdatePanel ID="up2" runat="server">
       <ContentTemplate>
       You selected:
       <asp:Label
           id="lblSelectedColor"
           Runat="server" />
       </ContentTemplate>
       </asp:UpdatePanel>
       <ajax:UpdatePanelAnimationExtender
           id="UpdatePanelAnimationExtender1"
           TargetControlID="up2"
           runat="server">
       <Animations>
           <OnUpdating>
           <Color
               Duration="0.5"
               Fps="20"
               Property="style"
               PropertyKey="backgroundColor"
               StartValue="#FFFFFF"
               EndValue="#FFFF90" />
           </OnUpdating>
           <OnUpdated>
           <Color
               Duration="3"
               Fps="20"
               Property="style"
               PropertyKey="backgroundColor"
               StartValue="#FFFF90"
               EndValue="#FFFFFF" />
           </OnUpdated>
       </Animations>
       </ajax:UpdatePanelAnimationExtender>

   </form>

</body> </html></source>

Источник — «http://nfex.ru/index.php?title=ASP.NET_Tutorial/Ajax/UpdatePanelAnimation&oldid=3035»