Validasi Form Dengan Regex Jquery

Validasi Form Dengan Regex Jquery- Validasi form dengan jquery menggunakan regex, regular expresion, kali ini saya mau berbagi bagaimana cara membuat validasi form dengan jquery, jquery.validate ,  apa itu validasi? validasi berguna untuk menangani data yang dimasukkan kedalam suatu form sudah benarkah atau masih salah, jika tidak ada validasi maka data yang dimasukkan akan terinput semua kedalam database, mungkin dengan cara ini masih bisa di akali oleh si user karena sifatnya bukan server side, mudah-mudahan kedepan saya akan share validasi untuk server side, validasi dengan form php.

Oke sekarang kita masuk kedalam pokok bahasan, silahkan ikuti tutorial dibawah ini, mungkin sobat ingin membaca ebook regex disini 

Javascript:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" >
$(document).ready(function() {
$.validator.addMethod("email", function(value, element) 
{ 
return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value); 
}, "Please enter a valid email address.");

$.validator.addMethod("username",function(value,element)
{
return this.optional(element) || /^[a-zA-Z0-9._-]{3,16}$/i.test(value); 
},"Username are 3-15 characters");

$.validator.addMethod("password",function(value,element)
{
return this.optional(element) || /^[A-Za-z0-9!@#$%^&*()_]{6,16}$/i.test(value); 
},"Passwords are 6-16 characters");

// Validate signup form
$("#signup").validate({
rules: {
email: "required email",
username: "required username",
password: "required password",
},
});
});
</script>

HTML

<form method="post" action="thank.html" name="signup" id="signup">
Email<br />
<input type="text" name="email" id='email'/><br />
UserName<br />
<input type="text" name="username" id="username" /><br />
Password<br />
<input type="password" name="password" id="password" /><br />
<input type="submit" value=" Sign-UP " name='SUBMIT' id="SUBMIT"/>
</form>

CSS

body
{
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
}
input
{
width:220px;
height:25px;
font-size:13px;
margin-bottom:10px;
border:solid 1px #333333;
}
label.error 
{
font-size:11px;
background-color:#cc0000;
color:#FFFFFF;
padding:3px;
margin-left:5px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px; 
}

Sekian tutorial Validasi Form Dengan Regex Jquery hari ini, silahkan sedot saja disini, semoga bisa dimanfaatkan bagi sobat-sobat semua, jangan lupa coretannya ya sobat, sobat coret saya coret balik :D