آموزش 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 ، بر روی صفحه نمایش می دهد .
راجع این مطلب
سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...
>>>>> ورود به انجمن تخصصی
نطر خودتان درباره این صفحه را با ما در میان بگذارید :