mehmetduran.com - Paylaşmak Güzeldir...
jQuery Ajax İşlemlerinde Parametre Olarak Nesne Taşıma
Bu yazımda jQuery Ajax işlemlerinde script tarafından sunucuya taşıdığımız verileri nesne veya nesne dizisi olarak nasıl aktarabileceğimizi göstermeye çalışacağım. Ajax işlemlerinde kullanmak için geç kaldığım bir yöntem diyebilirim. Şimdiye dek tüm verileri string veya integer türü olarak teker teker sunucuya aktarıyordum. Şimdiki anlattığım yöntem ile verileri istediğimiz nesne türünde server ve client arasında taşıyabileceğiz. Bu yöntemde hem sunucu tarafında hem de kullanıcı tarafında kullanılan nesnelerin yani hem C# nesnelerinin hem de script nesnelerin uyumlu olması gerekiyor. Ajax işlemlerini etkin bir biçimde kullanmak istiyorsak bu yöntemin kullanılması gerektiğini düşünüyorum. Çünkü büyük esneklik ve kolaylık sağlıyor. Şimdi bu işlemi nasıl yapacağımıza bakalım ve hazırladığım örneği inceleyelim.

Örnek olarak; script ile kullanıcı tarafında dinamik olarak oluşturulan text kutularının değerlerini sunucu tarafında elde edeceğiz ve bu değerlere göre işlem yapacağız. Burada kullanıcı ve sunucu tarafında veri taşırken belirtmiş olduğum nesne taşıma yöntemini kullanacağız. Böylece oldukça dinamik bir uygulama yapmış olacağız. Bu yöntem ile bunun gibi çok daha kullanışlı ve rahat uygulamalar geliştirebiliriz.

Bu yazımda hazırladığım örnek üzerinden giderek kodları paylaşacağım. Her satırı tek tek anlatmayacağım ama önemli yerleri paylaşacağım. Diğer bölümleri merak edenler ise örneği indirerek inceleyebilirler. Öncelikle kullandığımız C# kodlarını ve Webmethod kodlarını inceleyelim.

 
// kullanılan sunucu taraflı nesne
  public class TextBox
  {
    public string Id { get; set; }
    public string Value { get; set; }
  }
 
  // Ajax isteğinde bulunulan Webmethodlar
  [System.Web.Services.WebMethod]
  public static List<TextBox> Kontrol(List<TextBox> kontroller) //parametre "TextBox[] kontroller" de olabilir.
  {
    // işlemler ....
    return kontroller;
  }
 
  [System.Web.Services.WebMethod]
  public static TextBox Kontrol2(TextBox kontrol)
  {
    // işlemler ....
    return kontrol;
  }
 

Daha sonra server tarafındaki bu kodların çalışmasını sağlayacak olan Ajax isteği ile beraber gelecek olan data parametresinin değerini nasıl vereceğimize bakalım. Bunun için javascript ile bir nesne tanımlayıp bu nesne üzerinden verileri aktaracağız. Tek bir nesne veya birden fazla nesne taşıyacağız. Bunun için yazacağımız script kodları inceleyelim.

 
   // Script Kodlar
 
   //Kullanılan script nesnesi
   function TextBox() {
     this.Id = 0,
     this.Value = "",
   }
 
   //data parametresi ile sunucuya aktarılacak script nesnelerinin oluşturulması
   var kontroller = [];
   for (var i = 0; i < 5; i++) {
     TB = new TextBox();
     TB.Id = i;
     TB.Value = "Deneme";
     kontroller.push(TB);
   }
 
   //jQuery Ajax'ın data parametresi ile birden fazla nesne gönderilecek ise oluşturulacak yapı
   [{"Id":"", "Value":""}, {{"Id":"", "Value":""}, {{"Id":"", "Value":""}, ...]
 
   //jQuery Ajax'ın data parametresi ile bir nesne gönderilecek ise oluşturulacak yapı
   {"Id":"", "Value":""}
 

Bu kodları da yazdıktan sonra ise uygulamaya geçelim. Bu kodların çalışır halini buradan görebilir ve örneği buradan indirebilirsiniz. Kodlar bu konuyla çok fazla içli dışlı olmayanlar için pek anlaşılır olmayabilir ama uygulama bir o kadar kullanışlı ve basit olmakta. Burada son bölümde paylaştığım script kodlarda tek nesnenin veya nesne dizisinin data parametresinde nasıl olacağını belirttim. Bu yapı JSON yapısıdır ve sunucu tarafında bu yapı çözümlenerek script trafındaki nesne türü sunucu tarafındaki nesne türüne dönüştürülüyor. Bu konunun en can alıcı noktası bu olsa gerek. Bu yöntem ile buna benzer çok daha esnek uygulamalar geliştirilebilir. Özellikle Linq ile entegre bir biçimde çalışacak olursak çok daha efektif uygulamalar geliştirebiliriz.

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

İyi Çalışmalar.
Bookmark and Share
Bu Yazıyı Değerlendirin.
Konuyla İlgili Olabilecek Diğer Yazılar Jquery İnner Fade Uygulaması Asp.net ile Dll Oluşturma ve Kullanma Jquery ve Asp.net MVC ile Ajax İşlemleri jQuery Eklenti (Plugin) ve jQuery Özel Metot Hazırlama Asp.net MVC Captcha Uygulamam
Yorumlar
Yorum Yaz
RSS Yorum Takibi
Miraç 18 Nisan Pazar 2010 16:10 #1
Değişik bir uygulama teşekkürler :)
Serdar 20 Nisan Salı 2010 10:35 #2
Sırf bu mesele yüzünden jquery ajax kullanmaya yanaşmıyordum. Güzel metotmuş teşekkürler.
Ahmet Yaşar 28 Nisan Çarşamba 2010 15:56 #3
Sevgili mehmet asp.net mvc yapısında sqlconnection,sqlcommand kullanarak veritabanı işlemlerini yapan elde edilen sonuçları ekrana basan bir uygulamayı bizimle paylaşabilirmisin.Benim için önemli kardeşim.İyi çalışmalar.
Mehmet Duran 28 Nisan Çarşamba 2010 21:26 #4
Merhaba. Bahsettiğin konularda çalışmış isen kullanmış olduğun kodları hiç değiştirmeden MVC yapısında da kullanabilirsin. Bunun için Controller bölümünden View'lara veri taşıma konusunu incelemeni öneririm. Tam bu konuda buradaki yazımı inceleyebilirsin.
Ahmet Yaşar 29 Nisan Perşembe 2010 14:31 #5
Sevgili Mehmet benim tam olarak istedğim olay şuydu sqlconnection,sqlcommand vb. kullanarak elde edeceğimiz makale id'lerini foreach veya for kullanarak Url.Actionlara paremetre olarak nasıl atabiliriz. Bir nevi başlık detay ilişkisi gibi düşünebilirsin.Bunun için alacağımız verileri "List" şeklinde alıp for vaya foreach ile dönmem mi gerek eğer öyleyse ufak bir örnek paylaşabilirmisin.Son olarak eğer böyle kullanırsak model katmanını kullanmamış olmazmıyız.Başarılar arkadaşım.
Mehmet Duran 30 Nisan Cuma 2010 00:08 #6
Linkini verdiğim yazımda Controller bölümünden farklı yapıdaki (string, datatable) verileri View'lara aktarma işlemini yaptım. Burada aynı şekilde sen List yapısını veya istediğin yapıyı aktarabilirsin. Aktaracağın veri tanımlamış olduğun Model yapısında olabilir veya olmayabilir. Ayrıca Model katmanında direk verileri elde edebilecek bir yapın varsa Controller bölümüne gerek kalmadan direk olarak View tarafında kodlama yaparak Model bölümünden elde edeceğin verileri kullanabilirsin.
İ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.
Başarısızlıklarınız ile soylu bir şekilde yüzleşin, başarıdan farkı kalmayacaktır.
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