JQuery kullanarak RadioButtonList’te değer almak, seçim yapmak

12 Ocak 2012
Bu yazıyı beğendiysen paylaşmayı unutma :)
Pin It

JQuery ASP.NET

ASP.NET ile hazırladığınız projelerinizde JQuery kullanıyorsanız -yoksa kullanmayan var mı?- RadioButtonList ile yaptığınız işlemlerde ihtiyacınız olabilecek değer alma ve seçim yapma işlemlerine bir göz atalım.

RadioButtonList bildiğiniz üzere seçenekli işlemlerde tek seçim yaptırmamızı sağlayan faydalı bir web kontrolü. Eğer projelerinizde benim gibi .NET’in kendi Ajax kütüphanelerini kullanmıyorsanız, JQuery ile yaptığınız Ajax işlemlerinde RadioButtonList kontrolünde sıklıkla kullandığımız işlemlerden ikisi olan değer alma ve set etme işlemlerine bir bakalım.

Öncelikle şöyle bir senaryomuz olsun. Futbolumuzun dört büyüklerini RadioButtonList kontrolü aracılığı ile listeleyelim ve işlemlerimizi bunun üzerinden götürelim.

JQuery RadioButtonList

Yukarıdaki ekranın aspx sayfamızdaki kod görüntüsü aşağıdaki gibi olacaktır.

JQuery RadioButtonList

Aynı sayfanın yorumlandıktan sonraki HTML çıktısı da aşağıdaki gibi olacaktır.

JQuery RadioButtonList

Bu ekran görüntülerini kontrol edelim ki, JQuery kodumuzu yazarken buradaki yapıya göre hazırlayacağız.

İkinci resimde gördüğünüz gibi RadioButtonList‘imizde sayfamızı çalıştırmadan önceki seçili seçeneğimiz “Beşiktaş“. Sayfamızı çağırdığımızda ise seçili olarak gelen seçenek “Trabzon Spor“. Bu işlemi aşağıdaki gibi gerçekleşiyoruz.

$(“#<%=RBL_Takimlar.ClientID %>”).find(“input[value=’4′]”).attr(“checked”, “checked”);

Önce JQuery ile RadioButtonList‘imizin ID değeri olan “RBL_Takimlar” ın içerisinden “find” metodu değeri “4” olan seçeneğin “checked” parametresine “checked” değeri atayarak seçili hale getiriyoruz. Bu çalışma şeklini özellikle kayıt düzenleme sayfalarında kayıtlı seçeneği seçili göstermek için kullanabilirsiniz. Bunun için ise kodun input[value=’4′] olan bölümünde “4” yerine veritabanınızdan gelen değeri yazdırmanız gerekiyor. İşaretlenecek kaydı bulduğumuza göre şimdi o seçeneği işaretli hale getirmemiz gerekiyor. Bunun için da aşağıdaki kodu kullanacağız.

$(“#<%=RBL_Takimlar.ClientID %> input:radio:checked”).trigger(“click”);

Yaptığımız işlemi şöyle açıklayabiliriz. “RBL_Takimlar” ID’li form elemanımız içerisindeki input‘lardan hangisi işaretli yani checked durumda ise JQuery trigger özelliği ile o seçeneğe click olayını gerçekleştirerek seçili hale getiriyoruz.

Şimdi de seçim yapıldığın da seçeneğin değerini nasıl okuyacağımıza bakalım. Yapacağımız işlem oldukça basit.

$(“#<%=RBL_Takimlar.ClientID%> input”).click(function() {
   alert($(“#<%=RBL_Takimlar.ClientID%> input:radio:checked”).val());
});

JQuery RadioButtonList

RBL_Takimlar” ID’li form elemanımız içerisindeki input‘lardan biri tıklandığında yani click olayı meydana geldiğinde, checked durumundaki form elemanının değerini val özelliğiyle okuyoruz. Bu işlemi de veritabanına kayıt ya da örneğimizde olduğu gibi seçili seçeneği göstermek için kullanabiliriz.

JQuery RadioButtonList

Sonuç olarak kodumuz yukarıdaki gibi oluşacaktır.

Benzer Yazılar


DeliPenguen'i Google+'da bulun



  1. Kema
    12 Ocak 2012 - 20:07

    Ya allah aşkına yazdığınız bilişim makalelerinde türkçemizi doğru kullanalım, dil sade ve anlaşılır olsun. Lütfen istirham ediyorum önce gidin biraz yazma kurallarını öğrenin. İnanın ilk parafraftan sonra makaleyi okuma isteğim kalmadı. Emeğinizi bu şekilde tüketmeyin. Lütfen biraz daha kaliteli ve akıcı bir makale yazın….

    • :DeliPenguen
      12 Ocak 2012 - 20:15

      Pardon ama nerde bir tashih hatası gördünüz de bu izlenime kapıldınız anlayamadım. Yanlış gördüğünüz bir yer olduysa yardımcı olsaydınız da düzeltseydim daha yapıcı bir yorum olurdu. Zira söyledikleriniz ile yaptıklarınız fena halde çelişiyor. Sadece yazdığınız yorumda 4 tane yazım hatası yapmışsınız, bir de kalkmış bu konuda eleştiri yazmışsınız. Bu yaptığınız düpedüz ayıp.. Eleştirirken önce insan biraz kendine bakmalı değil mi? Hele de yazım hatalarından bahsettiğiniz kişi ömrünün 12 yılını teknoloji editörü ve yazar olarak geçirmişse “insanlık haliyle” yaptığı bir hata olmadığı sürece bu kadar insafsızca yorum yapılmaz. Sevgiler.