title: Bootstrap Form Validator Not Working
body: <p>I'm trying to get a bootstrap form with validation. I saw <a href="http://1000hz.github.io/bootstrap-validator/#validator-events" rel="nofollow">this</a> example code and tried using it. The validation is not working. I read through the document and everything I need is in here. Each form element that's inputed improperly should popover immediately with a message saying what's wrong. The box should also turn red but none of this is happening. Makes no sense to me whatsoever. Please help!</p>
  
  <p>Bootstrap in my head</p>
  
  <pre><code>&lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"&gt;
  
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css"&gt;
  
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;form data-toggle="validator" role="form"&gt;
  
        &lt;div class="form-group"&gt;
          &lt;label for="inputName" class="control-label"&gt;Name&lt;/label&gt;
          &lt;input type="text" class="form-control" id="inputName" placeholder="Cina Saffary" required&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;label for="inputTwitter" class="control-label"&gt;Twitter&lt;/label&gt;
          &lt;div class="input-group"&gt;
            &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
            &lt;input type="text" pattern="^([_A-z0-9]){3,}$" maxlength="20" class="form-control" id="inputTwitter" placeholder="1000hz" required&gt;
          &lt;/div&gt;
          &lt;span class="help-block with-errors"&gt;Up to 20 letters, numbers and underscores&lt;/span&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;label for="inputEmail" class="control-label"&gt;Email&lt;/label&gt;
          &lt;input type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required&gt;
          &lt;div class="help-block with-errors"&gt;&lt;/div&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;label for="inputPassword" class="control-label"&gt;Password&lt;/label&gt;
          &lt;div class="form-group col-sm-6"&gt;
            &lt;input type="password" data-minlength="6" class="form-control" id="inputPassword" placeholder="Password" required&gt;
            &lt;span class="help-block"&gt;Minimum of 6 characters&lt;/span&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group col-sm-6"&gt;
            &lt;input type="password" class="form-control" id="inputPasswordConfirm" data-match="#inputPassword" data-match-error="Whoops, these don't match" placeholder="Confirm" required&gt;
            &lt;div class="help-block with-errors"&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;div class="radio"&gt;
            &lt;label&gt;
              &lt;input type="radio" name="underwear" required&gt;
              Boxers
            &lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="radio"&gt;
            &lt;label&gt;
              &lt;input type="radio" name="underwear" required&gt;
              Briefs
            &lt;/label&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;div class="checkbox"&gt;
            &lt;label&gt;
              &lt;input type="checkbox" id="terms" data-error="Before you wreck yourself" required&gt;
              Check yourself
            &lt;/label&gt;
            &lt;div class="help-block with-errors"&gt;&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  
  
        &lt;div class="form-group"&gt;
          &lt;button type="submit" class="btn btn-primary"&gt;Submit&lt;/button&gt;
        &lt;/div&gt;
  
      &lt;/form&gt;
  </code></pre>