Bir veya birden çok UpdatePanel’in sayfada
yer aldığı uygulamalarda bazen bölgesel
bazen detüm sayfadaki yüklemelerin
durumlarına ait bilgileri kullanıcıya göstermek önemli
olacaktır. ASP.NET ile beraber gelen UpdateProgress
kontrolü ile kolaylıkla asenkron işlemlerin takibini
yaparak kullanıcılara “Yükleniyor” mesajları
gösterebiliyoruz.
İlk UpdateProgress örnegi
UpdateProgress kullanabilmemiz için sayfada bir
asenkron AJAX işleminin gerçekleşiyor olması
gerekir. Bu nedenle hemen aşağıdaki gibi bir sayfayı
hazırlayarak bir UpdatePanel içerisinde bir Label ve
Button yerleştireceğiz.
|
|
| <%@ Page Language="VB" AutoEventWireup="false"
| | CodeFile="Default.aspx.vb" Inherits="_Default" %>
| | <!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>Untitled Page</title> |
|
|
|
| </head>
| | <body>
| | <form id="form1" runat="server">
| | <div>
| | <asp:ScriptManager ID="ScriptManager1" runat="server">
| | </asp:ScriptManager>
| | <asp:UpdatePanel ID="UpdatePanel1" runat="server">
| | <ContentTemplate>
| | <asp:Button ID="Button1" runat="server" Text="Button" />
| | <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
| | </ContentTemplate>
| | </asp:UpdatePanel>
| | </div>
| | </form>
| | </body>
| | </html> |
|
Sonrasında hemen Button1’in arkasına aşağıdaki
kodları yazarak 5 saniyelik bir yükleme işlemini simüle
etmek için sistemi 5 saniyeliğine asenkron isteğe cevap
verirken uyutalım.
|
|
| VB
| | Partial Class _Default
| | Inherits System.Web.UI.Page
| | Protected Sub Button1_Click(ByVal sender As Object, ByVal e As
| | System.EventArgs) Handles Button1.Click
| | System.Threading.Thread.Sleep(5000)
| | End Sub
| | End Class
| | C#
| | public partial class Default2 : System.Web.UI.Page
| | {
| | protected void Button1_Click(object sender, EventArgs e)
| | {
| | System.Threading.Thread.Sleep(5000);
| | }
| | } |
|
Tüm bu işlemleri tamamladıktan sonra sıra geldi
sayfaya uygun bir UpdateProgress kontrolü koymaya.
UpdateProgress kontrollerini aşağıdaki şekliyle
sayfada istediğiniz yere yerleştirebilirsiniz.
|
|
| <asp:UpdateProgress ID="UpdateProgress1" runat="server">
| | <ProgressTemplate>
| | Yükleniyor...
| | </ProgressTemplate>
| | </asp:UpdateProgress> |
|
Yukarıdaki kod içerisinde de görebileceğiniz üzere
UpdateProgress kontrolünün içerisindeki
ProgressTemplate aslında UpdateProgress
kontrolünün görünür yüzünü tanımlıyor.
UpdateProgress kontrolleri normal şartlarda sayfada
gözükmezler. Sadece asenkron bir AJAX yüklemesi
gerçekleşirken UpdateProgress sayfada görünür
olacaktır. Böylece Button1’e bastığımızda
“Yükleniyor” mesajı beş saniye boyunca kullanıcıya
gösterilecek.
|
|
| <%@ Page Language="VB" AutoEventWireup="false"
| | CodeFile="Default.aspx.vb" Inherits="_Default" %>
| | <!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>Untitled Page</title>
| | </head>
| | <body>
| | <form id="form1" runat="server"> |
|
| 1 | | 2 | | 3 | | 4 | | 5 | | 6 | | 7 | | 8 | | 9 | | 10 | | 11 | | 12 | | 13 | | 14 | | 15 | | 16 | | 17 | | 18 |
|
| <div>
| | <asp:ScriptManager ID="ScriptManager1" runat="server">
| | </asp:ScriptManager>
| | <asp:UpdatePanel ID="UpdatePanel1" runat="server">
| | <ContentTemplate>
| | <asp:Button ID="Button1" runat="server" Text="Button" />
| | <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
| | </ContentTemplate>
| | </asp:UpdatePanel>
| | <asp:UpdateProgress ID="UpdateProgress1" runat="server">
| | <ProgressTemplate>
| | Yükleniyor...
| | </ProgressTemplate>
| | </asp:UpdateProgress>
| | </div>
| | </form>
| | </body>
| | </html> |
|
