jquery - Validate Form Initially When User Starts Typing -
i using jquery plugin form validation. current code posted below, validation starts after first time lost focus/blur event happens on element.
however, validation performed when user starts typing.
$(document).ready(function(){ $.validate({"form" : "#testform"}); });
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/jquery.form-validator.min.js"></script> <link href="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/theme-default.min.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="testform"> <p> email <input name="email" data-validation="email"> </p> <p> username <input name="user" data-validation="length alphanumeric" data-validation-length="3-12" data-validation-error-msg="user name has alphanumeric value (3-12 chars)"> </p> </form> </body> </html>
you need keyup
trigger validations when user starts typing:
$('input').on('keyup', function() { $(this).validate(); }); $(document).ready(function() { $.validate({ "form": "#testform" }); });
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/jquery.form-validator.min.js"></script> <link href="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/theme-default.min.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="testform"> <p> email <input name="email" data-validation="email"> </p> <p> username <input name="user" data-validation="length alphanumeric" data-validation-length="3-12" data-validation-error-msg="user name has alphanumeric value (3-12 chars)"> </p> </form> </body> </html>
Comments
Post a Comment