Me-retrieve Nilai
1. Text Field
Elemen text field menyediakan properti value yang bisa digunakan untuk menetapkan atau mendapatkan nilai elemen.
<html>
<head>
<title>Demo Retrieve</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!---
function getTextValue() {
var myForm = document.form1;
// Mendapatkan nilai text field
alert("Nilai Teks: " + myForm.nama.value);
}
//-->
</script>
<form name=form1 action="#">
Nama <input type="text" name="nama" />
<input type="submit" value="Submit" onclick="getTextValue()" />
</form>
</body>
</html>
2. Select (Combo Box)
Secara umum, properti value tersedia di semua elemen HTML. Dengan demikian, kita juga bisa memanfaatkannya untuk mendapatkan nilai select atau combo box.
<html>
<head>
<title>Demo Retrieve</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function getSelectedValue() {
var myForm = document.form1;
// Mendapatkan nilai selected field
alert("Nilai : " + myForm.sex.value);
}
//-->
</script>
<form name=form1 action="#">
Jenis Kelamin:
<select name="sex">
<option value="Pria">Pria</option>
<option value="Wanita">Wanita</option>
</select>
<input type="button" value="Submit" onclick="getSelectedValue()" />
</form>
</body>
</html>
Untuk operasi cepat tanpa perlu klik button pada select, kita bisa menambahkan event onchange.
<html>
<head>
<title>Demo Retrieve</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function getSelectedValue() {
var myForm = document.form1;
// Mendapatkan nilai selected field
alert("Nilai : " + myForm.sex.value);
}
//-->
</script>
<form name=form1 action="#">
Jenis Kelamin:
<select name="sex" onchange="getSelectedValue();">
<option value="Pria">Pria</option>
<option value="Wanita">Wanita</option>
</select>
</form>
</body>
</html>
3.Check Box
Khusus untuk pengambilan nilai check box, terlebih dahulu kita perlu mengidentifikasi item yang dipilih.
<html>
<head>
<title>Demo Retrieve</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function getCheckedVal() {
var element;
var len = document.form1.length;
var str = "";
for (i = 0; i < len; i++) {
element = document.form1[i];
if (element.type == "checkbox") {
if (element.checked == true) {
str = str + element.value + "\n";
}
}
}
if (str.length == 0) {
alert("Anda tidak memilih");
} else {
alert(str);
}
}
-->
</script>
<form name=form1 action="#">
<p> Aksesoris: <br />
<input type="checkbox" name="chkDVD" value="DVD-ROM" />DVD-ROM <br />
<input type="checkbox" name="chkMouse" value="Mouse" />Mouse <br />
<input type="checkbox" name="chkkey" value="Keyboard" />Keyboard<br/>
<input type="button" value="OK" onclick="getCheckedVal()" />
</form>
</body>
</html>
No comments:
Post a Comment