Single Button Check or Uncheck all checkbox
Cara Check All / Cheklis Semua cehkbox dengan Javascript , ya.. pada tutorial kai ini suckittrees dot com akan memberikan penjelasan bagaimana cara yang bisa dilakukan untuk Check atau Uncheck All Checkbox dengan Javascript.
Javascript merupakan script yang berjalan di sisi client, maka dari itu ini bisa dilakukan jika user mengaktifkan fungsi javascript di browsernya,
Jika Pada tutorial Sebelumnya kita membuat Cara Check All / Cheklis Semua cehkbox dengan Javascrip dengan 2 button kali ini kita membuat dengan Single button :
Berikut code dengan Single Button :
<SCRIPT LANGUAGE="JavaScript">
function Check(chk)
{
if(document.myform.Check_All.value=="Check All"){
for (i = 0; i < chk.length; i++)
chk[i].checked = true ;
document.myform.Check_All.value="UnCheck All";
}else{
for (i = 0; i < chk.length; i++)
chk[i].checked = false ;
document.myform.Check_All.value="Check All";
}
}
</script>
Untuk kode HTML nya :
<form name="myform" action="checkboxes.asp" method="post">
<b>Scripts for Web design and programming</b><br>
<input type="checkbox" name="check_list" value="1">ASP<br>
<input type="checkbox" name="check_list" value="2">PHP<br>
<input type="checkbox" name="check_list" value="3">JavaScript<br>
<input type="checkbox" name="check_list" value="4">HTML<br>
<input type="checkbox" name="check_list" value="5">MySQL<br>
<input type="button" name="Check_All" value="Check All"
onClick="Check(document.myform.check_list)">
</form>
Script dengan Menggunakan Single Checkbox untuk Mengontrolnya :
<SCRIPT LANGUAGE="JavaScript">
function Check(chk)
{
if(document.myform.Check_ctr.checked==true){
for (i = 0; i < chk.length; i++)
chk[i].checked = true ;
}else{
for (i = 0; i < chk.length; i++)
chk[i].checked = false ;
}
}
</script>
Untuk Kode HTML nya :
<form name="myform" action="checkboxes.asp" method="post">
<b>Scripts for Web design and programming</b><br>
<input type="checkbox" name="check_list" value="1">ASP<br>
<input type="checkbox" name="check_list" value="2">PHP<br>
<input type="checkbox" name="check_list" value="3">JavaScript<br>
<input type="checkbox" name="check_list" value="4">HTML<br>
<input type="checkbox" name="check_list" value="5">MySQL<br>
<input type="checkbox" name="Check_ctr" value="yes"
onClick="Check(document.myform.check_list)"><b>Check Control</b>
</form>
Demikianlah Cara Check All Checkbox dengan Menggunakan Javascript, Semoga tutorial ini dapat bermanfaat.