Checkbox Tümünü Seç Nasıl Yapılır?

Checkbox Tümünü Seç Nasıl Yapılır?

İnternette iletişim formlarında sıkça karşılaşmış olduğumuz checkbox olayı sayesinde daha düzgün bir görünüme sahip olmaktayız. Genellikle anket doldururken veya birden fazla sorunun yanıtını alırken HTML yapısı olan checkbox sayesinde veri çekiminde bulunuruz. Bugün ise jQuery kütüphane yapısını kullanarak basit tümünü seç / tümünü iptal et seçeneklerini kullanarak formdaki bütün checkbox’ların işaretlenmesini sağlayabileceğiniz basit kod yapısını paylaşmak istedim. O halde, jQuery kullanılarak HTML’de tümünü seç nasıl yapılır?

<!DOCTYPE HTML> <html lang="tr-TR"> <head> <meta charset="UTF-8"> <title>HTML Checkbox Tümünü Seç Nasıl Yapılır?</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#hepsini_secmelisin").on("click", function() { this.checked ? $(".hepsini_sec").each(function() { this.checked = !0 }) : $(".hepsini_sec").each(function() { this.checked = !1 }) }), $(".hepsini_sec").on("click", function() { $(".hepsini_sec:checked").length == $(".hepsini_sec").length ? $("#hepsini_secmelisin").prop("checked", !0) : $("#hepsini_secmelisin").prop("checked", !1) }) }); </script> </head> <body> <ul> <li><input type="checkbox" id="hepsini_secmelisin" /> Tümünü Seç / İptal Et</li> <ul> <li><input type="checkbox" class="hepsini_sec" value="Meslek edinmek"/>Meslek edinmek</li> <li><input type="checkbox" class="hepsini_sec" value="Arkadaş bulmak"/>Arkadaş bulmak</li> <li><input type="checkbox" class="hepsini_sec" value="Kendimi geliştirmek"/>Kendimi geliştirmek</li> <li><input type="checkbox" class="hepsini_sec" value="Vakit geçirmek"/>Vakit geçirmek</li> <li><input type="checkbox" class="hepsini_sec" value="Ne var ne yok diye bakmak"/>Ne var ne yok diye bakmak</li> </ul> </ul> </body> </html>

Gibi yukarıdaki kodu kendinize göre düzenleyebilir ve editleyebilirsiniz.

Yorum Yap

Yorumlar
Youtube Go Nedir?
Youtube Go Nedir? 02 Eylül 2017
Bip Messenger Uygulaması Nedir?
Bip Messenger Uygulaması Nedir? 03 Temmuz 2016
SEOPix İle Markanızı Büyütün!
SEOPix İle Markanızı Büyütün! 15 Ekim 2021
Mobil İçin Sabit Reklam Nasıl Yapılır?
Mobil İçin Sabit Reklam Nasıl Yapılır? 09 Temmuz 2016
PHP Site Hackleme Nasıl Yapılır? Çözümü Nedir?
PHP Site Hackleme Nasıl Yapılır? Çözümü Nedir? 09 Temmuz 2017
Üç Boyutlu Yazıcı Nasıl Kullanılır?
Üç Boyutlu Yazıcı Nasıl Kullanılır? 29 Ağustos 2017
WordPress Admin Logosunu Değiştirmek
WordPress Admin Logosunu Değiştirmek 28 Haziran 2017
Codeigniter Framework Nedir?
Codeigniter Framework Nedir? 16 Mayıs 2017