Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision
Previous revision
web:formvalidation.io [2023-11-04 09:00] – created adminweb:formvalidation.io [2023-11-04 10:39] (current) admin
Line 1: Line 1:
-===== Web ===== +====== Web ======
-=== formvalidation.io === +
-  * website: [[https://formvalidation.io/]] +
-  * +
  
 +===== formvalidation.io =====
 +  * website: [[https://formvalidation.io/]]
 +==== Installation ====
 +<code bash>
 +npm install @form-validation/bundle
 +npm install @form-validation/locales
 +npm install @form-validation/styles
 +npm install @form-validation/plugin-j
 +</code>
 +==== Typical code ====
 +<code php | css>
 +    <?php if ( defined('PAGE_OPTIONS') and in_array('formvalidation', PAGE_OPTIONS) ) { ?>
 +      <link rel="stylesheet" href="/node_modules/@form-validation/plugin-bootstrap5/lib/styles/index.min.css" />
 +      <link rel="stylesheet" href="/node_modules/@form-validation/styles/lib/styles/index.min.css" />
 +    <?php } ?>
 +</code>
 +<code php | javascript>
 +  <?php if ( defined('PAGE_OPTIONS') and in_array('formvalidation', PAGE_OPTIONS) ) { ?>
 +    <script src="/node_modules/@form-validation/bundle/lib/umd/popular.min.js"></script>
 +    <script src="/node_modules/@form-validation/locales/lib/umd/nl_BE.min.js"></script>
 +    <script src="/node_modules/@form-validation/plugin-bootstrap5/lib/umd/index.min.js"></script>
 +    <script src="/node_modules/@form-validation/"></script>
 +  <?php } ?>
 +</code>
 +==== Typical errors ====
 +  * ''Cannot read properties of null (reading 'classList')''
 +    * Caused by bootstrap5-plugin: this requires the form-control to be embedded in a ''.row'' div > the .row div will contain the ''.fv-plugins-bootstrap5-row-invalid'' style and add a ''.fv-plugins-message-container.invalid-feedback'' div to the bottom of the row.