iTanggu.net

Fungsi berikut berfungsi mencentang/memilih atau tidak memilih semua checkbox atau bahasa kerennya check/uncheck all multiple checkbox.

Contoh kasus penggunaan fungsi ini yaitu mungkin anda sudah pernah menggunakan phpMyAdmin, saat anda mem-browse sebuah table, maka disebelah kiri setiap baris dari data yang ditampilkan akan ada sebuah checkbox. Dan dibagian bawah list data tersebut, anda dapat men-check all dan uncheck all dari semua data tersebut yang kemudian anda dapat melakukan action edit atau delete.

JavaScript Code:

function checkUncheckAll(theElement) {

	var theForm = theElement.form;

	for(z=0; z<theForm.length;z++){

    	if(theForm[z].type == 'checkbox' && theForm[z].name != 'checkall'){
	  		theForm[z].checked = theElement.checked;
	  	}

	}
}

HTML Code:

<form action="" method="post" enctype="multipart/form-data" name="form" id="form" >
<table width="250" border="0" cellspacing="0" cellpadding="3">
  <tr>
    <td width="50" align="center" bgcolor="#CCCCCC"><input name="checkall" type="checkbox" onclick="checkUncheckAll(this);"></td>
    <td width="100" bgcolor="#CCCCCC"><strong>Title</strong></td>
    <td width="100" bgcolor="#CCCCCC"><strong>Author</strong></td>
  </tr>
  <tr>
    <td align="center"><input name="data[]" value="1" type="checkbox"></td>
    <td>PHP </td>
    <td>admin</td>
  </tr>
  <tr>
    <td align="center"><input name="data[]" value="2" type="checkbox"></td>
    <td>Ajax</td>
    <td>admin</td>
  </tr>
  <tr>
    <td align="center"><input name="data[]" value="3" type="checkbox"></td>
    <td>Javascript</td>
    <td>admin</td>
  </tr>
  <tr>
    <td align="center"><input name="data[]" value="4" type="checkbox"></td>
    <td>HTML</td>
    <td>admin</td>
  </tr>
</table>
</form>

Demonya bisa lihat disini