Üye Girişi Yapınız     


    E-Posta
    

    Şifreniz
    



Şifremi Unuttum


Ana Sayfa Site Hakkında İletişim Ziyaretçi Defteri Döküman İndir Makale Ekle Haber Ekle

     Ajax ile sayfanın bir bölümünün yenilenmesi(UpdatePanel kullanımı)
     admin     07.02.2013     20:17:38

Bir web sayfasında bir butona tıklayınca sayfanın tümünün yenilendiğini görürsünüz. Sayfanın tümünün yenilenmesi yerine sadece bir bölümünün yenilenmesini(Lokal yenileme) nasıl sağlarız. Bu işlemi ajax bileşenlerini kullanarak gerçekleştirebiliriz. Lokal yenileme işlemini gerçekleştirmek için Ajax’ın Update Panel kontrolünü kullanacağız.



Bu işlemin nasıl yapılacağını bir uygulama üzerinde anlatmaya çalışacağım.

Örneğin aşağıdaki gibi öğrencilerin numaralarını girerek sınav sonuçlarını sorgulayabilecekleri bir sayfa düşünelim.

Burada öğrenciler numaralarını girdikten sonra Enter’a veya Göster butonuna basınca sayfanın tümü yenilenmeden sınav sonucunun görüntülenmesi sağlanmaktadır.

Bu resim tasarım aşamasından bir kesittir. 

Bu resim ise Visual Studio programı ToolBox penceresi Ajax Bileşenleri bölünmünden bir görüntüyü içermektedir.

İşlem Basamakları : 

1) Update panel kontrolünü kullanabilmek için bir adet ScriptManager(Ajax Bileşeni) ekliyoruz.(<Body> etiketinden sonra ekleyiniz.)

2) ScriptManager’ın dışına bir adet Update panel ekliyoruz(Ajax Bileşeni). Update panel içerisine yenilenmesini istediğimiz bileşnleri ekleyeceğiz.

3) UpdatePanel içerisine, öğrenci numarasının girilmesi için bir adet TextBox ekliyoruz.(Enter’a basınca sayfayı yenilemesi için AutoPostBack özelliğini True yapınız.)

4) UpdatePanel içerisine, sonucun görüntülenmesi için bir adet buton ekliyoruz.

Örnek sayfamınız aspx sayfasının kod görünümünin ilgili kısmı aşağıdaki gibidir.


Örnek sayfamınız aspx.vb sayfasının kod görünümünin ilgili kısmı aşağıdaki gibidir.


Tüm bu işlemleri tamamladıktan sonra yaptığınız çalışmanın nasıl çalıştığını görmek için TIKLAYINIZ...

Sorgulama yapmak için siteye üye olmak zorundasınız. Üye değilseniz olmak için tıklayınız

Öğrenci numarası olarak 305 giriniz.

Bir sonraki derste görüşmek üzere...İyi çalışmalar (admin)

Facebook'ta Paylaş    
Diğer AJAX İçerikleri       Tüm Yazılar        Ana Sayfa


  =>Soru Sorun veya Yorum Yazın...

İsim Giriniz :
  

  =>Yapılan Yorumlar...