Asp.Net AJAX Ogreniyorum Serisi 03
- Sevdanur GENC
- Feb 4, 2012
- 2 min read
UpdateProgress Nesnesi Asp.Net AJAX Ogreniyorum Serisi 00'da da bahsettigimiz gibi; web uygulamanizda sectiginiz yada calismak istediginiz herhangi bir panelde guncelleme yapacaginiz anda o panelde karsi tarafin beklemesi esnasinda bir uyari mesaji veya gorsel bir bekleme image'i ile karsi tarafi bilgilendirebilirsiniz. Simdi bunlari sirasiyla aciklayalim ve birer basit uygulama gelistirelim.
UpdateProgress Nesnesi ;
Ajax uygulamalarinizda hazirlamis oldugunuz web sayfasinda calistiginizda PostBack olmayacagi icin, karsi taraftarki kullanicilara update edilen sayfanizin yeniden olusturulmasi esnasinda bilgilendirme mesajlari yada gorsellikle bunlari bir sekilde belirtmemiz gerekir. Bunun sebebi, kullanicilar herhangi bir degisikligin, her hangi bir guncellemenin olmadigini anlik olarak dusunebilirler. Bu kontrol UpdatePanel ile birlikte calisir ve sayfa guncellenmesi esnasinda UpdateProgress calisir. Panelinizin guncellenmesi bittikten sonra UpdateProgress'in calismasida sona erecektir.
Uygulama ;
Simdi dilerseniz basit bir uygulama ile UpdateProgress nesnesini inceleyelim...
Oncelikle Visual Studio'da yeni bir Web Application projesi baslatalim, ve icerisinde yeni bir Web Form olusturalim. Bu Web form'um design kismina yandaki tools icerisine aktarilmis olan Ajax Extensions arac kutusu vasitasiyla ScriptManeger nesnesini design gorunumu icerisinde ki body'nin icerisine surukleyerek birakalim(!) Hatirlarsaniz; Bunu yapmamizda ki sebep; bu kontrol tasarim ekraninda tum Ajax kontrollerinin en ustunde olmasi gerekiyor ki uygulama icerisinde ki tum Ajax nesnelerinin scriptlerine ulasabilsin.
Hemen ardindan Uygulamaya bir UpdatePanel surukleyerek birakalim, ki bu nesne sayesinde ProgressBar’da herhangi bir degisme olmadan yani PostBack islemi gerceklesmeden kullanicilara verileri tekrardan aktarabilmemizdir.
Ve yine panel icerisine birer adet Label, Button, Image, UpdateProgress ve Data sekmesinden GridView nesnelerini ekleyelim... Yapacagimiz uygulama da butona tiklanildiginda kisiler tablosundaki tum bilgileri 10 saniye icerisinde kullaniciya getirmesi ve bu 10 icerisinde kullaniciya beklemesi icin gerekli ikaz yazi ve gorsellikle verilmektedir.
Tasarim ekrani asagida ki gibi olacaktir ;
WebForm.Aspx Kaynak Kodlari ;
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Kisiler Tablosundaki Bilgileri Getir..." onclick="Button1_Click" />
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img alt="" src="yukleniyor.gif style="width: 68px; height: 68px" />
<br>Kisi Bilgileri Yukleniyor, Bekleyiniz...
</br>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:GridView ID="GridView1" runat="server">
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
WebForm.Aspx.Cs Kaynak Kodlari ;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
namespace WebApplication1
{
public partial class WebForm8 : System.Web.UI.Page
{
protected void Button1_Click(object sender, EventArgs e)
{
SqlConnection baglan = new SqlConnection();
baglan.ConnectionString = @"Data Source=NANO_SNG;Initial Catalog=nanonungunlugu;Integrated Security=True";
SqlCommand sqlkomudu = new SqlCommand();
sqlkomudu.Connection = baglan;
sqlkomudu.CommandText = "select * from tbl_kisiler";
DataTable da_tab = new DataTable();
SqlDataAdapter sql_da_adapter = new SqlDataAdapter(sqlkomudu);
System.Threading.Thread.Sleep(10000);
sql_da_adapter.Fill(da_tab);
GridView1.DataSource = da_tab;
GridView1.DataBind();
}
}
}
Ekran ciktilari sirasiyla asagidaki gibi olacaktir ;
Butona tiklanildiktan sonra kullaniciyi bilgilendiren ve UpdateProgress'in calistigi gorunum;
10 saniyelik sure bittikten sonra kullaniciya getirilecek olan sonuclar;
Sirada ki ilgili makale icin ; Asp.Net Ajax Ogreniyorum Serisi 04 ; https://sevdanurgenc.com/archives/1534
Comments