mehmetduran.com - Paylaşmak Güzeldir...
Jquery ve Ajax İşlemlerinde Class Kullanma
Bu yazımda Jquery ve Ajax işlemlerinde yazmış olduğumuz class'ları kullanmayı göreceğiz. Ajax metodunda yazmış olduğumuz class'a istekte bulunup class'a ait özellikleri elde edeceğiz. Daha önce yapmak istediğim ancak başaramadığım bu durumu aşağıda linkini vereceğim siteden edindiğim bilgiler ile yapabildim. Böylece Jquery ile Ajax işelemlerini daha etkin daha esnek olarak kullanabileceğiz. Ayrıca bu türlü kullanım ile çok farklı uygulamalar geliştirebiliriz. Önümüzdeki dönemde düşündüğüm bazı uygulamaları bu yöntem ile hazırlayıp kullanacağım. Şimdi bu işlemleri nasıl yapacağımıza bakalım.

Öncelikle Ajax işlemleri için Web Service kullandım ve kodlamalarımı Web Service'te yaptım. Örnek olması için iki farklı örnek hazırladım. Hem tek bir class'a istek yapacağız hem de List olarak düzenlediğimiz class'a istek yapacağız. Bunun için hazırladığımız kodlar şöyle olmalı.

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class web : System.Web.Services.WebService {
 
    [WebMethod]
    public kisi getir()
    {
      kisi ks = new kisi();
      ks.adi = "Mehmet";
      ks.soyadi = "Duran";
      ks.kimlik_no = 12345;
      return ks;
    }
 
    [WebMethod]
    public List<kisi> kisiler()
    {
      List<kisi> ks = new List<kisi>
      {
        new kisi(){adi = "Mehmet", soyadi = "Duran", kimlik_no = 12345},
        new kisi(){adi = "Sinan", soyadi = "Özkan", kimlik_no = 12346},
        new kisi(){adi = "Semih", soyadi = "Öztürk", kimlik_no = 12347}
      };
      return ks;
    }
}
 
public class kisi
{
  public string adi { get; set; }
  public string soyadi { get; set; }
  public int kimlik_no { get; set; }
}

Bu şekilde hazırladığımız Ajax kodlarımıza Jquery içinde yer alan Ajax metodu ile istekte bulunacağız. Bunun için yazmamız gereken kodlar ise şöyle olmalı.

  <script type="text/javascript">
    $(document).ready(function(){
      $.ajax({
        type: "POST",
        url: "web.asmx/getir",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg){
          // Tek class'a yaptığımız istek ve dönen sonucu okumamız
          $("#data1").html(msg.d.adi + " " + msg.d.soyadi + " " + msg.d.kimlik_no);
        }
      });
 
      $.ajax({
        type: "POST",
        url: "web.asmx/kisiler",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg){
          // List olarak belirttiğimiz class'a  yaptığımız istek ve sonuçları okumamız
          $.each(msg.d, function(i){
            $("#data2").append(this.adi + " " + this.soyadi + " " + this.kimlik_no + "<br/>");
          });
        }
      });
    });
  </script>

Yaptığım örneği çalışır halde burada görebilirsiniz. Bu şekilde basit bir örnek hazırladım. Ancak bu yöntem ile birçok farklı ve kullanışlı Ajax uygulaması hazırlanabilir. Önümüzdeki dönemde sitemde kullanmak üzere birkaç uygulama hazırlayacağım.

Daha önce bu konu ile ilgilenmiş ancak tam olarak yapamamıştım. Ancak yabancı bir sitede karşılaştığım bilgi ile bu sorunu çözdüm. Faydalandığım ve sorunu çözmemi sağlayan siteye buradan ulaşabilirsiniz. Sorun ise istekte bulunduğumda gelen sonucu almak için ajax metodumda msg.d olarak almaya çalışmamdı. Ancak bu şekilde undefined olarak sonuç elde ediyordum. Ama json tipinde  dönen  sonucu okumak için msg.d.ozellik_adi gibi bir kodlama yapmamız gerekiyormuş. Bunu da linkini vermiş olduğum siteden öğrendim.

Hazırladığım örneği buradan görebilir, buradan da indirebilirsiniz.

İyi Çalışmalar!
Mehmet Duran 10 Şubat Salı 2009 6 26439 4,2
Ajax Javascript Asp.net C Sharp jQuery Jquery Class İndir Web Service List Generic Class JSON
Bookmark and Share
Bu Yazıyı Değerlendirin.
Konuyla İlgili Olabilecek Diğer Yazılar Son Yaptıklarım Bölümü Javascript ile Klavye Tuşlarının Kontrolü Jquery ile Slayt Uygulamam Hazır Jquery ile Tab Kontrol Uygulaması jQuery ile Modal Hazırlama (Eklenti ile)
Yorumlar
Yorum Yaz
RSS Yorum Takibi
imkansız kız 26 Mart Perşembe 2009 21:04 #1
yaw çok hoş da bunun visual basic 2005 te yapılmışı yok mu:S:S
Mehmet Duran 26 Mart Perşembe 2009 22:44 #2
Maalesef yok. Ancak visual basic`e çevirmek çok zor olmasa gerek. ;)
Serkan Çevik 26 Haziran Cumartesi 2010 14:16 #3
Mehmet arkadaşım gösterdiğin uygulama çok güzel normal asp.net tarafında bu uygulamayı nasıl yapabiliriz. Classları oluşturup buna uygun fonfisonu yazıp page loaduna eklediketen sonra html tarafında bu classlara erişmeye çalışıyorum fakat ulaşamayorum.Yardımcı olursan sevinirim.
Mehmet Duran 26 Haziran Cumartesi 2010 14:45 #4
Merhaba. Yapmak istediğin yazdığın nesneleri sayfanın html bölümünde yazdığın server taraflı kodlar içinde kullanabilmek sanırım. Bunun için tanımladığın nesnelerin App_Code içinde olması lazım. (Eğer WebSite projesi ise. Web Application ise gerek yok.) Bu şekilde nesnelerini tanımladıktan sonra istediğin sayfanın html bölümünde server taraflı kod yazarken istediğin nesneye erişebilir ve kullanabilirsin.
bayram 10 Ocak Pazartesi 2011 09:29 #5
güzel çalışma. şöyle bir örnek var mı acaba? Generic list içersine jquery ile kişi ekleyip istediğimiz kişşiyi çıkarma işlemini nasıl yaparız?
Mehmet Duran 13 Ocak Perşembe 2011 08:53 #6
@bayram, generic list c# tarafında tanımlı olan bir yapı. Ancak buna gerek olmadan, script ile bir diziye istediğin kadar ekleme çıkarma yapabilirsin. Daha sonra dizinin son halini ajax ile sunucuya generic bir yapıda gönderebilir ve sunucuda bu yapıyı istediğin şekilde değerlendirebilirsin.
İsim :
Site :
Yorum :

Buradan bu yazıya ait yorumları RSS olarak takip edebilirsiniz.

Bu servis ile yazılara eklenen yorumları RSS ile takip ederek konu ile ilgili başkaları tarafından yapılan yorumları veya konuyla ilgili sorduğunuz sorulara verilen cevapları görebilirsiniz.
Ne edersen kendine, edersin kendi kendine.
Bölümler
Yazılar
Arşiv
Arama
Linkler
Site İçi Arama
Son Zamanlarda Ne Yapıyorum ?
İstatistikler - Araçlar - Reklam
İstatistikler
Sayaç
Mehmet Duran | mehmetduran.com | Copyright © 2009