+

+BS-Validation

+ +

Directives to apply bootstrap styles to AngularJs form elements. +You can either apply success, error or both styles. In case of success state, it's only applied to dirty forms.

+
+
+
+ + +
+
+ + +
+
Type anything in form
+
+
+

+Instalation

+ +

jQuery 1.6 or newer is required

+ +

With Bower

+ +
bower install angular-bootstrap-validation
+
+ +

For a manual installation copy the angular-boostrap-validation.js inside dist folder.

+ +

+Quick Start

+ +

Include the module bs-validation

+ +
angular.module('app', ['bs-validation']);
+
+ +

You've three directives:

+ +
    +
  • bs-has - Apply both success and error directives
  • +
  • bs-has-success - Add 'has-success' class
  • +
  • +

    bs-has-error - Add 'has-error' class

    + +

    You can use directives at the form element or in .form-group elements.

    +
  • +
+ +
<form novalidate bs-has> <!-- Apply both success and error styles to name and address -->
+    <div class="form-group">
+        <label class="control-label">Name</label>
+        <input type="text" class="form-control" required ng-model="name" />
+    </div>
+    <div class="form-group">
+        <label class="control-label">Address</label>
+        <input type="text" class="form-control" required ng-model="address" />
+    </div>
+</form>
+
+<form novalidate>
+    <div class="form-group" bs-has-success> <!-- Apply sucess styles to name only -->
+        <label class="control-label">Name</label>
+        <input type="text" class="form-control" required ng-model="name" />
+    </div>
+    <div class="form-group" bs-has> <!-- Apply sucess and error styles to address only -->
+        <label class="control-label">Address</label>
+        <input type="text" class="form-control" required ng-model="address" />
+    </div>
+</form>
+ +

+Authors

+ +

I've only modified a little bit the code and put it on bower. The REAL authors are:

+ + + +

The SO question where they've published the code: here

+ + + +