FormValidation v0.8.0 supports both Bootstrap 3/4 as well as
Foundation 5/6.
You need to perform the following changes if you want to try Bootstrap 4 (alpha) or still
want to use Foundation 5:
Step 1: Including the correct files
This section is already mentioned in the Including library section:
<!-- Bootstrap CSS v4.0.0 alpha -->
< link rel = "stylesheet" href = "/vendor/bootstrap/css/bootstrap.min.css" >
<!-- FormValidation CSS file -->
< link rel = "stylesheet" href = "/vendor/formvalidation/dist/css/formValidation.min.css" >
<!-- jQuery v1.9.1 or higher -->
< script src = "/vendor/jquery/jquery.min.js" ></ script >
<!-- Tether library, which is required if you want to use Bootstrap tooltip -->
< script src = "/vendor/tether/js/tether.min.js" ></ script >
<!-- Bootstrap JS -->
< script src = "/vendor/bootstrap/js/bootstrap.min.js" ></ script >
<!-- FormValidation plugin and the class supports validating Bootstrap form -->
< script src = "/vendor/formvalidation/dist/js/formValidation.min.js" ></ script >
< script src = "/vendor/formvalidation/dist/js/framework/bootstrap4.min.js" ></ script >
Don't confuse bootstrap(.min).js file provided by the Bootstrap framework
with bootstrap4(.min).js provided by FormValidation which is placed
inside the formvalidation/dist/js/framework directory.
They are two different files and both of them need to be included as
mentioned above.
<!-- Foundation v5 CSS -->
< link rel = "stylesheet" href = "/vendor/foundation/css/normalize.min.css" >
< link rel = "stylesheet" href = "/vendor/foundation/css/foundation.min.css" >
<!-- FormValidation CSS file -->
< link rel = "stylesheet" href = "/vendor/formvalidation/dist/css/formValidation.min.css" >
<!-- jQuery v1.9.1 or higher -->
< script src = "/vendor/jquery/jquery.min.js" ></ script >
<!-- Foundation JS file -->
< script src = "/vendor/foundation/js/vendor/modernizr.js" ></ script >
< script src = "/vendor/foundation/js/foundation/foundation.js" ></ script >
< script src = "/vendor/foundation/js/foundation/foundation.tooltip.js" ></ script >
<!-- FormValidation plugin and the class supports validating Foundation form -->
< script src = "/vendor/formvalidation/dist/js/formValidation.min.js" ></ script >
< script src = "/vendor/formvalidation/dist/js/framework/foundation5.min.js" ></ script >
Don't confuse foundation(.min).js file provided by the Foundation
framework with foundation5(.min).js provided by FormValidation which is
placed inside the formvalidation/dist/js/framework directory.
They are two different files and both of them need to be included as
mentioned above.
Step 2: Setting the framework option
You need to set the framework option as
following:
$ ( yourForm ). formValidation ({
framework : 'bootstrap4' ,
...
});
$ ( yourForm ). formValidation ({
framework : 'foundation5' ,
...
});