<!-- html-->
<form name="registration" id="registration" action="" method="post">
<div class="form_settings">
<p><span>Full Name</span><input type="text" name="name" id="name" maxlength="30" placeholder="e.g. Gourav Ranadive" class="validation" error_id="error_name"/>*<div class="validationerror" id="error_name"></div></p>
<p> </p>
<p><span>Username/Email</span><input type="text" name="email" id="email" maxlength="30" placeholder="e.g.
gourav@gmail.com" class="validation" error_id="error_email"/>*<div class="validationerror" id="error_email"></div></p>
<p> </p>
<p><span>Choose Password</span><input type="password" name="password" id="password" maxlength="20" placeholder="Choose Password" class="validation" error_id="error_password"/>*<div class="validationerror" id="error_password"></div></p>
<p> </p>
<p><span>Confirm Password</span><input type="password" name="cpassword" id="cpassword" maxlength="20" placeholder="Re-enter Password" class="validation" error_id="error_re_password"/>*<div class="validationerror" id="error_re_password"></div></p>
<p> </p>
<p><span>Mobile Number</span><input type="text" name="mobile" id="mobile" maxlength="10" placeholder="e.g. 9900000000" class="validation" error_id="error_mobile"/>*<div class="validationerror" id="error_mobile"></div></p>
<p> </p>
<p><span>City</span><input type="text" name="city" id="city" placeholder="e.g. Nipani" class="validation" error_id="error_city"/>*<div class="validationerror" id="error_city"></div></p>
<p style="padding-top: 15px"><span> </span><input class="submit" type="submit" name="register" value="Register" /></p>
</div>
</form>
<!-- javascript-->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/jquery.lavalamp.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
$("#lava_menu").lavaLamp({
fx: "backout",
speed: 700
});
var error_array=Array('Enter Correct Name(Only Characters and single space)','Enter Valid Email Id','Choose Password','Confirm Password','Enter 10 digits Mobile Number','Enter Valid City Name');
var verror=false;
$("#registration").submit(function(g){
$('.validation').each(function(){
var one=$(this).attr('error_id');
//var type=$(this).attr('data_type');
var two=$(this).val();
if(two=='')
{
//alert('enter value');
$('#'+one+'').html("Please fil out this field");
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else if(one=='require_name')
{
var name_pat=/^[a-zA-z ]+$/;
if(!name_pat.test(two))
{
$('#'+one+'').html(error_array[0]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else if(one=='require_email')
{
var email_pat=/^[\w\-]+\@[\w\-]+\.[\w\-]+$/;
if(!email_pat.test(two))
{
$('#'+one+'').html(error_array[1]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else if(one=='require_password')
{
if(two=='')
{
$('#'+one+'').html(error_array[2]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else if(one=='require_re_password')
{
var pass=("#password");
if(two!=pass)
{
$('#'+one+'').html(error_array[3]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else if(one=='require_mobile')
{
var mobile_pat=/^(\d{10})$/;
if(!mobile_pat.test(two))
{
$('#'+one+'').html(error_array[4]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else if(one=='require_city')
{
var city_pat=/^[a-zA-Z]+$/;
if(!city_pat.test(two))
{
$('#'+one+'').html(error_array[5]);
$('#'+one+'').animate({top:"10px",opacity:"1"},250);
verror=true;
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
}
else
{
$('#'+one+'').html('');
$('#'+one+'').FadeTo(300,0).animate({left:"20px"});
}
});
if(verror)
{
g.preventDefault();
}
});
});
</script>