Jquery ile formdaki tüm chexboxları seçmek (check all / uncheck all)


Eğer formunuzda milyonlarca checkbox inputu varsa ve hepsini tek tek seçili hale getirmek cehennem azabı gibi gelebilir. Bu işi salt javascript ile halledebileceğiniz gibi eğer sayfanızda zaten jquery kütüphanesi yükleniyorsa ufacık bir fonksiyon ile de kolaylıkla üstesinden gelebilirsiniz.

Jquery fonksiyonu

1
2
3
4
5
6
7
8
<script type="text/javascript">
  // Tüm checkboxları seç    
  function tumunuSec(status) {
    $("#kutucuklar input").each( function() {
      $(this).attr("checked",status);
     });
    }
</script>

Öncelikle sayfanın tepesine (veya harici .js dosyanıza) tüm işi halledecek olan fonksiyonu tanımlayın.

“kutucuklar” id’sine sahip kapsayıcı div

1
2
3
4
5
<div id="kutucuklar">
<input name="kutu1" value="1" type="checkbox">Kutu 1
<input name="kutu2" value="1" type="checkbox">Kutu 2
<input name="kutu3" value="1" type="checkbox">Kutu 3
</div>

Tüm checkbox elemanlarınızı “kutucuklar” id’sine sahip kapsayıcı bir divin içerisine yerleştirin. Dilerseniz bu div’i tüm formunuzu kapsayacak şekilde ayarlayabilir veya direkt formunuza bu id’yi tanımlayabilirsiniz.

Seçme / seçim kaldırma işlemini yapacak olan eleman

1
<input type="checkbox" onclick="tumunuSec(this.checked)">Tümünü Seç / Seçimi Kaldır

Son elemanı da yerleştirdikten sorna işiniz tamam, bu eleman sayesinde artık formunuzda yer alan tüm checkbox’ları seçili hale getirebilir veya tümünün seçimini aynı anda kaldırabilirsiniz.

İlginizi Çekebilecek Diğer İçerikler

Facebook Yorumları

8 Yorum

Uyarı: Yorumlarda link kullanmayınız. Link içeren yorumlar otomatik olarak spam kabul edilmektedir.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir