title: jQuery validation does not work. jQuery.Deferred exception: $(...).validate is not a function
body: <p>Yes, I tried to read all questions about this and searching information about this. It seems, that all is ok. But I have an error in browser.I spent a lot of time for understanding whats wrong, need help. </p>
  
  <p>What i tried to do:</p>
  
  <ol>
  <li>Change libraries</li>
  <li>Change order of libraries</li>
  <li>Make out scripts to other file</li>
  <li>Change place of script in file</li>
  <li>Change names and id of form</li>
  <li>Check syntax, of course, check syntax</li>
  </ol>
  
  <p>Thank you for your time.</p>
  
  <p><a href="https://i.stack.imgur.com/RWFY9.png" rel="nofollow noreferrer">picture with error in browser</a></p>
  
  <pre><code>&lt;%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %&gt;
  &lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %&gt;
  &lt;%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %&gt;
  &lt;c:set var="root" value="${pageContext.request.contextPath}"/&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
      &lt;title&gt;Edit account&lt;/title&gt;
  
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /&gt;
      &lt;script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.1.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"&gt;&lt;/script&gt;
  
      &lt;script src="resources/jsScripts/addInput.js" language="Javascript" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="resources/jsScripts/addInputWithValue.js" language="Javascript" type="text/javascript"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;script type="text/javascript"&gt;
  
      $().ready(function () {
          $('#registration').validate({
              rules: {
                  name: {
                      "required": true,
                      minlength: 2
                  },
                  surname: "required",
                  password: {
                      required: true,
                      minlength: 3
                  },
                  email: {
                      required: true,
                      email: true
                  }
              },
              messages: {
                  name: "Please enter your firstname",
                  surname: "Please enter your lastname",
                  password: {
                      required: "Please provide a password",
                      minlength: "Your password must be at least 3 characters long"
                  },
                  email: "Please enter a valid email address"
              },
              submitHandler: function (form) { // for demo
                  alert('valid form');
                  return false;
              }
          });
      });
  &lt;/script&gt;
  
  &lt;%@ include file="search.jsp" %&gt;
  &lt;div class="container-fluid jumbotron"&gt;
  
      &lt;div class="form-group row-center"&gt;
          &lt;form action="&lt;c:url value="/account"/&gt;" id="registration" name="registration" method="post"
          class="form-horizontal"
          enctype="multipart/form-data"&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="name" class="col-sm-3 control-label"&gt;Имя&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="text" class="form-control" name="name" id="name"
                  &lt;c:if test="${not empty account.name}"&gt;
                      value=${account.name}
                  &lt;/c:if&gt;
                  &gt;
              &lt;/div&gt;
  
          &lt;/div&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="surname" class="col-sm-3 control-label"&gt;Фамилия&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="text" class="form-control" name="surname" id="surname"
                  &lt;c:if test="${not empty account.surname}"&gt;
                      value=${account.surname}
                  &lt;/c:if&gt;
                  &gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="patronymic" class="col-sm-3 control-label"&gt;Отчество&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="text" class="form-control" name="patronymic" id="patronymic"
                  &lt;c:if test="${not empty account.patronymic}"&gt;
                      value=${account.patronymic}
                  &lt;/c:if&gt;
                  &gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="login" class="col-sm-3 control-label"&gt;Логин&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="text" class="form-control" name="login" id="login"
                  &lt;c:if test="${not empty account.login}"&gt;
                      value=${account.login}
                  &lt;/c:if&gt;&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group"&gt;
              &lt;label for="password" class="col-sm-3 control-label"&gt;Пароль&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="password" class="form-control" name="password" id="password"
                         placeholder="Введите новый пароль"&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="phone" class="col-sm-3 control-label"&gt;Телефонный номер&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="tel" class="form-control" id="phone" name="phones"
                  &lt;%--onchange="return validate(phones.value())"--%&gt;
                  onkeyup="alert('text some ext')"
                  &lt;c:if test="${not empty account.contactInfo}"&gt;
                      &lt;c:if test="${not empty account.contactInfo.phones}"&gt;
                          value=${account.contactInfo.phones.get(0).number}
                      &lt;/c:if&gt;
                  &lt;/c:if&gt;
                  &gt;
  
              &lt;/div&gt;
              &lt;div class="col-sm-1"&gt;
                  &lt;input class="btn btn-success btn-add form-control" type="button"
                         value="+"
                         onClick="addInput('dynamicInput');"
                  &gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div id="dynamicInput"&gt;
          &lt;/div&gt;
  
          &lt;c:if test="${not empty account.contactInfo.phones}"&gt;
              &lt;c:forEach var="phone" items="${account.contactInfo.phones}" varStatus="loopCount"&gt;
                  &lt;c:if test="${loopCount.count &gt; 1}"&gt;
                      &lt;script&gt;
                          addInputWithValue('dynamicInput', '${phone.number}');
                      &lt;/script&gt;
                  &lt;/c:if&gt;
              &lt;/c:forEach&gt;
          &lt;/c:if&gt;
  
          &lt;div class="form-group" align="right"&gt;
              &lt;label for="email" class="col-sm-3 control-label"&gt;email&lt;/label&gt;
              &lt;div class="col-sm-4"&gt;
                  &lt;input type="email" class="form-control" name="email" id="email"
                  &lt;c:if test="${not empty account.contactInfo}"&gt; value=${account.contactInfo.email}&lt;/c:if&gt;
                  &gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;/form&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;    
  </code></pre>