contact
WA: 0822-8846-7823
SMS: 0822-8846-7823
Call: 0822-8846-7823
BBM: D7DB3491
ebsofmail@gmail.com

Validasi Form dengan Javascript dan Menampilkan Pesan Error di Form

Posted in Javascript Jquery Life at 04 Januari 2017 With 0 Comments

Tidak habis-habisnya admin membahas tentang Validasi Form Untuk penanganan dan pencegahan data di website , Pada tutorial kali ini kita akan membahas tehnik membuat validasi form dengan menampilkan pesan error di dalam form tersebut , validasi form ini kita menggunakan javascript ,  Sebenarnya membuat validasi form tergantung dari setiap orang ,  untuk kelas pemula validasi pada form dengan menampilkan pessan di dalam form tersebut  mungkin masih belum banyak yang mengerti cara yang digunakan. nah ,,, pada kesempatan ini kita akan membahas validasi form tersebut

Untuk validasi ini agar lebih aman kita dapat kombinasikan dengan beberapa contoh validasi yang lainnya :

▼ Download Source Code Dibawah Ini ▼


Membuat Validasi Form

validasi form dan menampilkan pesan error di dalam form

Code HTML

<html>
<head>
<script type="text/javascript">
function validate()
{
var error="";
var name = document.getElementById( "name_of_user" );
if( name.value == "" )
{
error = " You Have To Write Your Name. ";
document.getElementById( "error_para" ).innerHTML = error;
return false;
}
var email = document.getElementById( "email_of_user" );
if( email.value == "" || email.value.indexOf( "@" ) == -1 )
{
error = " You Have To Write Valid Email Address. ";
document.getElementById( "error_para" ).innerHTML = error;
return false;
}
var password = document.getElementById( "password_of_user" );
if( password.value == "" || password.value >= 8 )
{
error = " Password Must Be More Than Or Equal To 8 Digits. ";
document.getElementById( "error_para" ).innerHTML = error;
return false;
}
else
{
return true;
}
}
</script>
</head>
<body>
<form method="POST" action="getdata.php" onsubmit="return validate();">
<input type="text" name="username" id="name_of_user">
<input type="text" name="useremail" id="email_of_user">
<input type="password" name="user_password" id="password_of_user">
<input type="submit" name="submit_form" value="Submit">
</form>
<p id="error_para" ></p>
</body>
</html>

Pada code html diatas dapat kita lihat terdapat tag p ( <p id="error_para" ></p> )yang kita beri id didalamnya, fungsi tersebut digunakan untuk menampilkan pesan error yang telah diproses oleh script javascript

Artikel Terkait

Diskusi