Overview

This plugin integrates form validation in AngularJS and Bootstrap 4 by extending form and ng-model directives.
It also provides a custom CSS file that removes default browser box-shadow from invalid form controls in validated forms.
Use novalidate html5 directive on form element if you want to disable it's validation.

This plugin also provides a set of additional validators and can be easily internationalized.

Basic validation example

All validation errors are added automatically to all elements with ng-model directive that are contained in form element.
Validation errors are displayed upon form submission or input change.
Also, you can reset form validation state using {formName}.resetValidation() method.
@
Form submitted successfully!

Tooltips

You can use 'invalid-tooltip' instead of 'invalid-feedback' by using the validate-mode directive on form element.
Default validate-mode can be changed in validateProvider.
@
Form submitted successfully!

Custom message

You can change default error message by using the {validateDirective}-error-msg.
E.g. required-error-message="custom text" or min-error-message="custom text"

Supported HTML5 & angularJS validators

Additional validators

This plugin provides a set of custom validators which are available by adding a directive to desired form control (eg. <input type="text" ng-model="..." validate-url/>).
validate-url and validate-host can also be added to an <textarea> element and validate it contents line by line.

i18n

All default error messages can be configured in validateProvider.
You can also include a language file from dist/i18n/ directory to change default (english) language.
So far only english and polish languages are available.

Input group fix

This plugin additionally provides a fix for input-group missing border radius by adding input-group-fix css class to the last non-feedback child element of input-group.
For this to work properly you need to include provided CSS file in your document.
You can disable this fix in validateProvider by setting inputGroupFix to false.
Without fix
@
With fix
@