Pada HTML terdapat fungsi checkbox untuk memilih item lebih dari satu. Berbeda dengan radio button yang hanya menentukan satu pilihan item saja.
Jika item yang ada itu berjumlah ratusan, apakah tidak kerepotan jika harus menseleksi semua item tersebut satu-satu. Untuk melakukan tersebut, buatlah fungsi untuk dapat memilih semua item dan meng-unselect semua item.
Fungsi berikut diterapkan dengan menggunakan tombol button.
Berikut code HTMLnya:
Simpan dengan format .html
Tampilannya adalah seperti berikut ini:
Jika item yang ada itu berjumlah ratusan, apakah tidak kerepotan jika harus menseleksi semua item tersebut satu-satu. Untuk melakukan tersebut, buatlah fungsi untuk dapat memilih semua item dan meng-unselect semua item.
Fungsi berikut diterapkan dengan menggunakan tombol button.
Berikut code HTMLnya:
<html>
<head>
<title>Select and Unselect Checkbox</title>
</head>
<body>
<script type="text/javascript">
function SetAllCheckBoxes(FormName, FieldName, CheckValue)
{
if(!document.forms[FormName])
return;
var objCheckBoxes = document.forms[FormName].elements[FieldName];
if(!objCheckBoxes)
return;
var countCheckBoxes = objCheckBoxes.length;
if(!countCheckBoxes)
objCheckBoxes.checked = CheckValue;
else
// set the check value for all check boxes
for(var i = 0; i < countCheckBoxes; i++)
objCheckBoxes[i].checked = CheckValue;
}
</script>
<form method="GET" action="page17.php" name="myForm" onsubmit="return false;">
<label for="myCheckbox1">
<input name="myCheckbox" value="1" id="myCheckbox1" type="checkbox">
Option 1 </label>
<br>
<label for="myCheckbox2"><input name="myCheckbox" value="2"
id="myCheckbox2" type="checkbox">
Option 2</label>
<br>
<label for="myCheckbox3"><input name="myCheckbox" value="3"
id="myCheckbox3" type="checkbox">
Option 3</label>
<br><input onclick="SetAllCheckBoxes('myForm', 'myCheckbox', true);"
value="Select All Item" type="button">
<input onclick="SetAllCheckBoxes('myForm', 'myCheckbox', false);"
value="Unselect All Item" type="button">
</form>
</body>
</html>Simpan dengan format .html
Tampilannya adalah seperti berikut ini:
Tidak ada komentar:
Posting Komentar