آموزش Ajax   > کنترل های ASP.Net  Ajax > مثال عملی کار با کنترل UpdateProgress

مثال عملی کار با کنترل UpdateProgress   :

در این بخش قصد داریم تا با ارائه یک مثال عملی و تشریح کد آن ، نحوه استفاده از کنترل UpdateProgress در ASP.Net  را به شما آموزش دهیم .

کد مثال زیر را مرور نمایید . هر بخش از کد که نیاز به توضیح داشته ، را با یک رنگ مجزا مشخص کرده و سپس آن را در پایان مثال توضیح  داده ایم :

در مثال زیر یک کنترل UpdateProgress ، وضعیت عملیات آپدیت شدن 2 کنترل UpdatePannel را نمایش می دهد .

کد <%@ Page Language="C#" AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
     <script runat="server">
            protected void Button_Click(object sender, EventArgs e)          // کد تابعی که در هنگام کلیک بر روی دکمه فرمان ها اجرا می شود
                {
                        System.Threading.Thread.Sleep(3000);       //    سرور یک تاخیر 3 ثانیه ای را انجام می دهد
                 }
      </script>

   <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
           <title> UpdateProgress  مثال عملی کار با کنترل تایمر</title>
           <style type="text/css">
                   #UpdatePanel1, #UpdatePanel2, #UpdateProgress1 {       //   تنظمیم خواص مورد نظر برای کنترل های مختلف
                          border-right: gray 1px solid; border-top: gray 1px solid;
                          border-left: gray 1px solid; border-bottom: gray 1px solid;
                    }
                   #UpdatePanel1, #UpdatePanel2 {
                         width:200px; height:200px; position: relative;
                         float: left; margin-left: 10px; margin-top: 10px;
                    }
                   #UpdateProgress1 {
                        width: 400px; background-color: #FFC080;
                        bottom: 0%; left: 0px; position: absolute;
                    }
             </style>
    </head>
    <body>
          <form id="form1" runat="server">
               <div>
                    <asp:ScriptManager ID="ScriptManager1" runat="server" />    <%-- برای کارکرد صحیح سایر کنترل ها وجود یک نمونه از این کنترل بر روی صفحه اجباری است --%>
                    <asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">  
                          <ContentTemplate>
                                 <%=DateTime.Now.ToString() %> <br />
                                 <asp:Button ID="Button1" runat="server" Text="Refresh Panel" OnClick="Button_Click" />
                          </ContentTemplate>
                   </asp:UpdatePanel>
                   <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">
                           <ContentTemplate>
                                  <%=DateTime.Now.ToString() %> <br />
                                  <asp:Button ID="Button2" runat="server" Text="Refresh Panel" OnClick="Button_Click"/>
                           </ContentTemplate>
                   </asp:UpdatePanel>
                   <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                         <ProgressTemplate>
                                Update in progress...
                         </ProgressTemplate>
                    </asp:UpdateProgress>
            </div>
         </form>
   </body>    </body>
</html>
خروجی مشاهده خروجی مثال
  • کد تابع جاوا اسکریپتی که در هنگام کلیک بر روی دکمه فرمان های موجود در دو کنترل UpdatePannel ، اجرا می شود .
  • کد کنترل UpdatePannel اول .
  • کد کنترل UpdatePannel دوم .
  • کد کنترل UpdateProgress ، که یک نمایه تصویری را در زمان آپدیت شدن کنترل های UpdatePannel ، بر روی صفحه نمایش می دهد .


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نطر خودتان درباره این صفحه را با ما در میان بگذارید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :        
سوال امنیتی : پایتخت ایران ؟