» » jQuery ile Toplu Seçme işlemi, Toplu Checkbox İşaretleme işlemi

Bu Yazımda jQuery ile toplu checkbox seçme işlemini anlatmaya çalışacağım. Bende sizler gibi jquery de yeni olan birisi olarak yavaş yavaş jQuery kütüphanesini tanımaya ve tanıdıkçada sizlerle paylaşmaya çalışıyorum. Şimdi bu işlem genellikle toplu yorum onaylama vs. toplu silme gibi işlemlerde kullanmak istediğimiz ancak beceremediğimiz bir husustur. Bu yazımda işin sadece jQuery kısmını anlatacağım. işin php kısmını ise php prgoramlama kategorisinde anlatacağım. checkbox tan gelen toplu veriyi array olarak alıp işleme koyma işlemi ayrı bir mevzudur. 

Biz bu yazımızda sadece görsel kımsına değineceğiz. ilk olarak sayfamıza jquery çağırıyoruz. ben bunun için google api yi kullanıyorum.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>

Daha sonra jQuery kodumuz :

<script type="text/javascript">$(function () {$(".tumunu-sec").click(function(){$(this).closest('table').find(':checkbox').attr('checked', this.checked);});});</script>

Şimdi de tablolarımız. :

<table id="tablo"><thead><tr><th width="20px"><input type="checkbox" class="tumunu-sec" title="Tümünü Seç"></th><th>Kategoriler</th></tr></thead>
<tbody><tr><td><input type="checkbox" name="kategoriler[]"></td><td>Php</td></tr><tr><td><input type="checkbox" name="kategoriler[]"></td><td>Mysql</td></tr><tr><td><input type="checkbox" name="kategoriler[]"></td><td>Html</td></tr><tr><td><input type="checkbox" name="kategoriler[]"></td><td>Css</td></tr><tr><td><input type="checkbox" name="kategoriler[]"></td><td>Jquery</td></tr></tbody></table>

yukarıdaki jQuery kodlarını <head> ... </head> tagları arasında çağırmayı unutmayınız.
07:42

0 yorum:

Yorum Gönder

Kaydol: Kayıt Yorumları (Atom)
 
Top