0

I designed jquery for validating form fields using bootstrap framework,but it didn't validate any field and I got Error like Uncaught TypeError: $(...).validate is not a function while submit action.How to fix the problem ? Please share your knowledge.

<script>
$(document).ready(function() {
    $('#loginform').validate({
        framework: 'bootstrap',
        icon: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            user_name: {
                validators: {
                    notEmpty: {
                        message: 'The username is required'
                    },
                    stringLength: {
                        min: 6,
                        max: 30,
                        message: 'The username must be more than 6 and less than 30 characters long'
                    },
                    regexp: {
                        regexp: /^[a-zA-Z0-9_]+$/,
                        message: 'The username can only consist of alphabetical, number and underscore'
                    }
                }
            },
            password: {
                validators: {
                    notEmpty: {
                        message: 'The password is required'
                    }
                }
            }
        }
    });
});
</script>
<form name="loginform" action="logincheck.jsp"  method="post">
  <div class="form-group">

  <label class="col-xs-3 control-label">Username</label>
      <div class="col-xs-4">

    <input type="text" class="form-control" name="user_name" placeholder="Username" />
   </div>
    <div class="form-group">
     <label class="col-xs-3 control-label">Password</label>
         <div class="col-xs-4">
           <input type="password" class="form-control" name="password" placeholder="Password" />
            </div>

        </div>
    <div class="text-center">
       <input type="submit" class="btn btn-primary" value="Sign in">
      </div>
Sparky
  • 98,165
  • 25
  • 199
  • 285
Pari Venthan
  • 59
  • 1
  • 1
  • 8
  • please include relevant js files. I suppose you are using jquery validate plugin, please include it after your jquery js. – Akki619 Aug 26 '15 at 09:13
  • You need to include the [jQuery validation](http://jqueryvalidation.org/) library... `` – Arun P Johny Aug 26 '15 at 09:15
  • And should attach `id="loginform"` onto form tag – Norlihazmey Ghazali Aug 26 '15 at 09:16
  • 1
    As @ArunPJohny says, '$(...).validate' is not a function indicates that the jQuery object doesn't have a validate method, indicating you've not included the validation JavaScript file, or that you've included it before the jQuery files and it's consequently been overwritten. – dougajmcdonald Aug 26 '15 at 09:17
  • Please do not use the [tag:jquery-validate] tag for the jQuery Validation Engine plugin - they are two different plugins. Edited. @ArunPJohny, look at the code inside his `.validate()` method... those options have nothing to do with the jQuery Validate plugin. – Sparky Aug 26 '15 at 14:08

0 Answers0