JQuery validate input fileds on keyup event
<html><head>
<script type="text/javascript" src="//code.jquery.com/jquery-1.8.3.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script type="text/javascript">//<![CDATA[
$(window).load(function(){
$(document).ready(function() {
$('#authForm').validate({
onkeyup: false,
rules: {
login: {
// customRule: true,
required: true,
minlength: 6 // for demo
}
}
});
$('#Form').validate({
rules: {
email: {
required: true,
email: true,
minlength: 6 // for demo
},
password: {
required: true
}
},
submitHandler: function(form) {
if ($('#authForm').valid()) {
//form.submit(); // commented out for demo
alert('submitted'); // for demo
return false; // for demo
}
},
errorPlacement: function(error, element) {
$('#authForm').valid(); // force validation on first form when this form has error
error.insertAfter(element); // default placement
}
});
});
});//]]>
</script>
</head>
<body>
<form novalidate="novalidate" id="authForm" action="#">
login: <input class="error" name="login" type="text"><label class="error" generated="true" for="login">Please enter at least 6 characters.</label><br>
</form>
<form novalidate="novalidate" id="Form" action="#">
email: <input class="error" name="email" type="text"><label class="error" generated="true" for="email">This field is required.</label><br>
password: <input class="error" name="password" type="password"><label class="error" generated="true" for="password">This field is required.</label><br>
</form>
<input type="submit">
</body></html>
Comments
Post a Comment