user3599415 user3599415 - 5 months ago 254
jQuery Question

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!

Answer

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 only in two places:

  1. Inside the <head> of your document
  2. or right before the closing </body> tag

jsBin demo

Comments