Icon plugin

Display various icons based on the field validity


With this plugin, you can see the icon whenever the field is being validated, and after the validation completes, it also displays other icon depending on the field is valid or not.
The following piece of code is the starting point to use the Icon plugin:
<link rel="stylesheet" href="/vendors/formvalidation/dist/css/formValidation.min.css" />
<form id="demoForm" method="POST">...</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.3/es6-shim.min.js"></script>
<script src="/vendors/formvalidation/dist/js/FormValidation.min.js"></script>
document.addEventListener('DOMContentLoaded', function(e) {
fields: {
plugins: {
icon: new FormValidation.plugins.Icon({
// Following is the default values
valid: 'fv-plugins-icon--valid',
invalid: 'fv-plugins-icon--invalid',
validating: 'fv-plugins-icon--validating',
The sample code above assumes that the FormValidation files are placed inside the vendors directory. You might need to change the path depending on where you place them on the server.
The validating, valid and invalid options present the list of CSS classes separated by a space that will be added to the icon when the field is being validated, valid or invalid.
The Icon plugin only supports the form made in the following CSS frameworks:
Bootstrap 3 frameworkBootstrap3 plugin
Bootstrap 4 frameworkBootstrap plugin
Bulma frameworkBulma plugin
Foundation frameworkFoundation plugin
Materialize frameworkMaterialize plugin
Milligram frameworkMilligram plugin
mini.css frameworkMini plugin
MUI frameworkMui plugin
Pure libraryPure plugin
Semantic UI frameworkSemantic plugin
Shoelace libraryShoelace plugin
Spectre frameworkSpectre plugin
Tachyons libraryTachyons plugin
turretcss frameworkTurret plugin
UIkit frameworkUikit plugin
The MandatoryIcon plugin is useful when you want to display the mandatory icon for required fields

See also


  • Hide the clear field icon on Internet Explorer. So you will not see two icons when using with the Icon plugin
  • First release