ASP.NET AJAX UpdatePanel Kullanımı

ASP.NET Ajax UpdatePanel hazırladığımız web sayfalarında bölümler oluşturup bu bölümlerin asenkron bir şekilde güncellenebilmesini sağlamaktadır. UpdatePanel içerisindeki olaylar PostBack işlemi olmadan çalışıp, güncellenebilirler. Böylece sayfaların daha hızlı çalışması ve sunucu – istemci arasındaki veri trafiğinin azaltılması sağlanır.

  UpdatePanel’i web sayfamızda kullanabilmemiz için Microsoft ASP.NET AJAX’ın kurulu olması gerekmektedir.

  UpdatePanel kontrolü iki kısımdan oluşmaktadır.

<ContentTemplate></ContentTemplate>
<Triggers></Triggers>

ContentTemplate : UpdatePanel içinde bulunan kontrollerin tanımlandığı kısımdır.
Triggers : UpdatePanel’in hangi kontroller tarafından nasıl tetikleneceğinin tanımlandığı kısımdır. Tetikleyici kısmında iki durum kontrol edilir. Tetikleyici kontrolün UpdatePanel içinde olması yada olmaması.

UpdatePanel tanımlaması kısımları ile aşağıdaki gibidir :

<asp:UpdatePanel ID=”UpdatePanel1″ runat=”server”> 
      <ContentTemplate>
         <!– Ýçerik –>
     </ContentTemplate>
     <Triggers>
         <!– Tetikleyici Bilgileri –>
     </Triggers>
</asp:UpdatePanel>

Şimdi UpdatePanel’i nasıl kullanacağımızı görelim :

İlk önce File -> New -> Web Site menüsünden ASP.NET AJAX Enabled Web Site seçeneğiniz seçerek yeni bir web projesi yaratalım.

ASP.NET Ajax uygulamalarının çalışabilmesi için ScriptManager kontrolünün sayfamıza eklenmiş olması gerekmektedir. Bunun Default.aspx sayfamıza ScriptManager kontrolünü ekleriz.

Şimdi UpdatePanel kontrolünü sayfamıza ekleyebiliriz.
 

Source kısmından UpdatePanel içeriğimizi aşağıdaki gibi değiştirelim.

<asp:UpdatePanel ID=”UpdatePanel1″ runat=”server”> 
    <ContentTemplate>
        <asp:Label ID=”Label1″ runat=”server” Text=”"></asp:Label><br />
        <asp:Button ID=”Button1″ runat=”server” Text=”Button” />
    </ContentTemplate>
</asp:UpdatePanel>

Sayfamızı Page_Load kısmana ise aşağıdaki kodu ekleyelim.
Label1.Text = DateTime.Now.ToLongTimeString();

Sayfamızı çalıştırdıktan ve butona tıkladıktan sonra göreceğiz ki label1 kontrolünde saat PostBack işlemi olmadan asenkron bir şekilde güncellenmektedir.

Eğer tetikleyici olarak kullanacağımız kontrol UpdatePanel içerisinde ise güncelleme işlemi hiçbir tetikleyici bilgisi girmeden çalışmaktadır bunu neden UpdatePanel’de bulunan ChildrensAsTrigger özelliğinin True olmasıdır. Biz bu değeri False yaparsak UpdatePanel içinde bulunan kontroller paneli güncellemeyecektir.

Peki eğer tetikleyici kontrol panelin dışında ise ?

Bu seferde UpdatePanel’de bulunan <Triggers></Triggers> kısmına aşağıdaki kodu eklememiz yeterli olacaktır.

<Triggers> 
    <asp:AsyncPostBackTrigger ControlID=”btnDisari” EventName=”Click” />
</Triggers>

Bu işlemi görsel olarak yapabilmek için UpdatePanel’in özelliklerinden Triggers seçeneği seçilir.

Açılan pencerede AsyncPostBackTrigger Panelin PostBack işlemine girmeden güncelleneceğini gösterir. Eğer bu panelin PostBack işlemine girerek güncellenmesini istersek PostBackTrigger seçeneği seçilir. ControlID Tetikleyici kontrol Event Name ise tetikleyici kontrolün hangi durumda UpdatePanel’i güncelleyeceğidir.

Yeliz KORKMAZ’ın Günlüğünden

Kurallar ve standartlar olmalıdır ama yaşamdaki en önemli parametre insandır. İnsanın düşünceleri ve duygusal yanı yaşamdaki etkinliğini kaldıramaz. Kaldırır ise robottan farkımız kalmaz. — Cezalandırıcı filminden.

WideDB ile Database İşlemleri…

WideDb csharp kodlarınızda database işlemleri daha rahat ve düzenli yapmanızı sağlayan bir araçtır. Bu aracı ve açık kaynak kodlarını http://sourceforge.net/projects/widedb adresinden temin edebilirsiniz. WideDb aracı ile database türü ayırt etmeksizin DML işlemlerini kolayca ve rahat bir şekilde gerçekleştirebilirsiniz. Örnek olarak bir isim, soyad ve telefondan oluşan bir databasede DML işlemlerini inceleyelim.
Database’imiz aşağıdaki gibi olsun:
Tablo ismi : KAYIT
idKAYIT – Auto – Public
Adi – Nvarchar
Soyadi – Nvarchar
Tel – Nvarchar
İlk once hazırladığımız Winforms veya ASP.NET projesinde database bağlatımızı widedb için oluşturmamız gerekmektedir.
Connection stringimiz aşağıdaki gibi olsun :
“Provider=SQLOLEDB;Data Source=.;Initial Catalog=CRM;User ID=sa;Password=;”
Widedb kullanırken tek dikkat etmemiz gereken kısım connection stringimizde Provider belirtmemizdir.
Şimdi database’imize kayıt işlemine bakalım.
Namespace kısmımıza using Wakiza.WideDB uzay ismini eklememiz gerekiyor.
Database bağlantımızı widedb ile oluşturuyoruz.
Wakiza.WideDB.dbConfig.instance.setConnectionString(connectionstring);
Ardindan DML işlemi için tablomuzu widedb ile bağlayalım.
dbObject kisidb = dbFactory.create(“KAYIT”, “idKAYIT”);
Daha sonra bilgi girmek istediğimiz kolonları ve alacakları değerleri yazıyoruz.
kisidb.setter(“Adi”, txtadi.Text);
kisidb.setter(“Soyadi”, txtsoyadi.Text);
kisidb.setter(“Tel”, txttelno.Text);
Bilgilerimize set ettikten sonra kayıt işlemini yapabilmesi için aşağıdaki komut ile INSERT işlemimizi tamamlıyoruz.
kisidb.save();
Şimdi de eklediğimiz kayıtları nasıl silebileceğimize bakalım.
Tekrar Db’yi ayarlıyoruz.
dbObject kisidb = dbFactory.create(“KAYIT”, “idKAYIT”);
Ardından silmek istediğimiz kayıta WideDB’yi set ediyoruz.
kisidb.setter(“idKAYIT”,1);
Son olarak aşağıdaki komut ile DELETE işlemimizi tamamlıyoruz.
kisidb.delete();
Şimdi de eklediğimiz kayıtlar üzerinde UPDATE işleminin nasıl yapıldığına bakalım.
UPDATE işlemini gerçekleştireceğimiz tablo için widedb ile object oluşturuyoruz.
dbObject kisidb = dbFactory.create(“KAYIT”, “idKAYIT”);
Ardından UPDATE işlemini yapmak istediğimiz kaydı set ediyoruz.
kisidb.setter(“idKAYIT”,1);
Set ettiğimiz kayıt bilgilerini getirebilmek için aşağıdaki komutu kullanmamız yeterli olacaktır.
kisidb.load();
Kaydımızı load ettiğimize göre şimdi de yeni değerleri atayalım.
kisidb.setter(“Adi”, txtadi.Text);
kisidb.setter(“Soyadi”, txtsoyadi.Text);
kisidb.setter(“Tel”, txttelno.Text);
Son olarak UPDATE işlemini tamamlamak için verileri kayıt ediyoruz.
kisidb.save();
Widedb aynı anda birden fazla tablo için kayıt işlemlerinde çok rahat ve çok kolay kullanımı ile gerçekten çok yararlı bir araçtır. Geliştirilebilir açık kaynak kodu ile de programcıların kendi isteklerine göre uyarlanabilmektedir.