CODEWITHSUNDEEP
javascriptjqueryformsvalidation
user3599415
user3599415

Reputation: 283

Validate is not a function

I am trying to validate a simple form. But I keep getting this error

Uncaught TypeError: $(...).validate is not a function

Here is my html file with form:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Cohorts</title>


  </head>
  <body>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script>
    <script src="trunk/dev/validation.js"></script>

    <form id="register-form" class="form-horizontal" name="form" ng-submit="addCohort()">

      <div class="form-group">

        <label class="control-label col-xs-3">Name:</label>

        <input name="email" placeholder="Email Address" type="text" ng-model="formCohort.firstname">

        <input class = "btn-btn-primary" id="submit-button"  type="submit" value="Sigin up">
      </div>

    </form>
  </body>
</html>

Here is my validation.

$(function () {
  $("#register-form").validate({
    rules:{
      email:{
        required: true,
        email: true

      }
    }
  });

});

Here is the error in my console:

enter image description here

What am I doing wrong?

Thank you!

Upvotes: 0

Views: 17615

Answers (1)

Roko C. Buljan
Roko C. Buljan

Reputation: 206151

You should first include the jQuery library
and than your validate plugin

<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script>
<script src="trunk/dev/validation.js"></script>

P.S: make sure you have only one validate plugin!

Additionally, I'd suggest you to include your <script> tags right before the closing </body> tag.

<form id="register-form">
  <input name="email" placeholder="Email Address" type="text">
  <input type="submit" value="Sigin up">
</form>


<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script>
<script>
  jQuery(function($) {
  
    $("#register-form").validate({
      rules: {
        email: {
          required: true,
          email: true
        }
      }
    });
    
  });
</script>

Upvotes: 5

Related Questions