title: jQuery validation in Bootstrap Modal does not work
body: <p>Applying jQuery validation to a Modal bootstrap it has no effect , checked all the included libraries and their order and noticed that they were correct.</p>
  
  <ul>
  <li>Bootstrap:            version 3.3.1</li>
  <li>jQuery:               version 1.11.1</li>
  <li><a href="http://jqueryvalidation.org/)" rel="nofollow">jQuery-validate</a>: version 1.13.1</li>
  </ul>
  
  <h2>Head Code:</h2>
  
  <pre><code>&lt;head&gt;
      &lt;title&gt;Titulo&lt;/title&gt;
  
      &lt;link rel="stylesheet" type="text/css" href="../CSS/StyleSheet.css"/&gt;
      &lt;script type="text/javascript" src="../Bootstrap/js/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="../Bootstrap/js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="../datepicker/js/bootstrap-datepicker.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="../Jquery-Validate/jquery.validate.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="../Javascript/ActionJS.js"&gt;&lt;/script&gt;
  
      &lt;link rel="stylesheet" type="text/css" href="../Bootstrap/css/bootstrap.min.css" media="screen" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="../datepicker/css/datepicker.css" media="screen" /&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, maximum-scale=1" /&gt;
  &lt;/head&gt;
  </code></pre>
  
  <h2>Modal code (Load it's HTML without AJAX)</h2>
  
  <pre><code>&lt;div class="modal fade" id="login_modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"&gt;
          &lt;div class="modal-dialog modal-lg"&gt;
              &lt;div class="modal-content"&gt;
                  &lt;form class="form-horizontal" id="login-form" action="../PHP/ValidateForm.php" method="get"&gt;
                      &lt;div class="modal-header"&gt;
                          &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
                          &lt;h4 class="modal-title span7 text-center" id="myModalLabel"&gt;&lt;span class="title"&gt;Login&lt;/span&gt;&lt;/h4&gt;
                      &lt;/div&gt;
                      &lt;div class="modal-body"&gt;
                          &lt;div class="col-md-6"&gt;
                              &lt;div class="form-group"&gt;
                                  &lt;label for="input_email" class="control-label col-md-3"&gt;Your Email (login)&lt;/label&gt;
                                  &lt;div class="col-md-9"&gt;
                                      &lt;input type="email" class="form-control" id="email" name="email" placeholder="Email"&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="form-group"&gt;
                                  &lt;label for="input_password" class="control-label col-md-3"&gt;Password&lt;/label&gt;
                                  &lt;div class="col-md-9"&gt;
                                      &lt;input type="password" class="form-control" id="pass" name="pass" placeholder="Password"&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="checkbox text-center"&gt;
                                  &lt;label&gt;&lt;input type="checkbox" id="remember_me" name="remember_me"&gt;Remember me on this computer&lt;/label&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="form-group text-center"&gt;
                              &lt;div class="col-md-6 col-md-offset-3"&gt;
                                  &lt;button type="reset" class="btn btn-danger"&gt;Reset&lt;/button&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="modal-footer"&gt;
                          &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;
                          &lt;button type="submit" class="btn btn-primary" name="login_form_submit" value="Login"&gt;Login&lt;/button&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Changing the tag  into the modal -body submit button does not work and checked in this video would be the correct position it.</p>
  
  <h2>ActionJS Code (validation file)</h2>
  
  <pre><code>$(document).ready(function(){
       $("#login-form").validate({
      rules:{
          name:{
              required:true,
              minLength:8
          },
          pass:"required"
      },
      messages:{
          name:{
              required:"Please provide your Login",
              minLength:"Your Login must be at least 8 characters"
          },
          pass:"Please provide your password"
      }
  });
  </code></pre>
  
  <p>});</p>