Check Box adalah suatu perintah yang digunakan untuk memberikan jawaban lebih dari satu. Misalnya ada suatu pertanyaan yang membolehkan kita untuk memilih lebih dari satu jawaban, bahkan boleh memilih semuanya. Mungkin bagi sipenjawab soal ini tidak masalah jika pilihannya hanya sedikit, tetapi jika pada soal itu terdapat banyak sekali jawaban, dan kita harus mencentang jawaban-jawaban itu satu persatu, tentunya hanya akan memakan waktu sipenjawab soal itu saja. untuk itu dalam jawaban pilihan itu, kita sibagai pembuatnya harus menyediakan tombol untuk menjawab semua pilihan dengan satu kali klik.
sebagai contoh, buatlah programnya seperti ini
<html>
<head>
<title> Blog Tutorial - checkbox </title>
</head>
<body>
<div style="width: 300px;">
<form>
<h3>Materi yang paling anda sukai</h3>
<fieldset>
<input type="checkbox" name="cek1"> Pemrograman<br>
<input type="checkbox" name="cek2"> Hacking<br>
<input type="checkbox" name="cek3"> Internet<br>
<input type="checkbox" name="cek4"> Multimedia<br>
<input type="checkbox" name="cek5"> Networking<br>
<input type="checkbox" name="cek6"> Hardware<br>
<input type="checkbox" name="cek6"> Open Source<br><hr>
<input type="checkbox" id="pilihsemua"> Check All<br>
</fieldset><br>
<input type="submit">
</form>
</div>
</body>
</html>
Jika anda jalankan program tersebut,
akan menghasilkan output seperti ini:
jika anda melakukan tanda centang pada tulisan check all, tentunya hanya tulisan tersebut saja yang akan tercentang, untuk membuat tulisan yang lain tercentang.
tambahkan skript berikut: letakaan pada kode <head> LETAKKAN DISINI </head>
<script type="text/javascript" src="../jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#pilihsemua').click(function () { $(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked); }); }); </script>
sebelumnya anda harus memiliki satu library jquery, yaitu jquery.js
jika anda jalankan programnya lagi, dan melakukan centang maka akan menghasilkan output sperti dibawah ini:
cukup dengan satu kali klik, maka semuanya akan terpilih
Posting Komentar
Semua Artikel Diblog ini boleh disebarluaskan,
asal mencantumkan sumbernya.
Terima kasih atas kunjungannya
Semoga artikel dblog ini bisa bermanfaat buat kita semua.
mohon kritik dan sarannya.
salam kenal dan salam Blogger Indonesia