Membuat validasi pada sebuah form bisa dilakukan dengan berbagai macam cara diataranya menggunakan PHP, JQuery, atau menggunakan javascript.
Kali ini saya akan sharing bagaimana cara melakukan validasi menggunakan javascript.
 |
| validasi password javascript |
Codingnya seperti ini.
<html>
<head>
</head>
<body>
<script language="javascript">
function validate() {
var password1 = document.getElementById('password').value;
var password2 = document.getElementById('repassword').value;
if (password1 != password2) {
alert("Password Tidak Sama!!");
} else {
alert("Password Tersimpan");
}
}
</script>
<form action="#" method="POST">
<input type="password" placeholder="Masukan password" id="password" />
<input type="password" placeholder="Masukan Kembali password" id="repassword" />
<input type="Submit" onClick="validate();" value="OK" />
</form>
</body>
</html>
Penjelasan
1. Membuat form, membuat input bertipe password dan memberi id yang unik pada setiap inputnya.
<form action="#" method="POST">
<input id="password" placeholder="Masukan password" type="password" />
<input id="repassword" placeholder="Masukan Kembali password" type="password" />
2. Membuat input bertipe submit, dan memberi action yaitu onClick. dan mengisikan fungsi validate(); kedalam event onclicknya<input id="password" placeholder="Masukan password" type="password" />
<input id="repassword" placeholder="Masukan Kembali password" type="password" />
<input type="Submit" onClick="validate();" value="OK" />
3. Membuat javascript validasi yang akan dipanggil ketika mengklik tombol OK
<script language="javascript">
function validate() {
var password1 = document.getElementById('password').value;
var password2 = document.getElementById('repassword').value;
if (password1 != password2) {
alert("Password Tidak Sama!!");
} else {
alert("Password Tersimpan");
}
}
</script>
function validate() {
var password1 = document.getElementById('password').value;
var password2 = document.getElementById('repassword').value;
if (password1 != password2) {
alert("Password Tidak Sama!!");
} else {
alert("Password Tersimpan");
}
}
</script>
Anda juga bisa menambahkan validasi banyaknya leng minimal yang harus diisi pada kondisi if di funtion validate()
Semoga membantu
