diff options
author | XhmikosR <xhmikosr@gmail.com> | 2020-05-02 18:49:12 +0300 |
---|---|---|
committer | XhmikosR <xhmikosr@gmail.com> | 2020-06-03 15:57:20 +0300 |
commit | 358d637d1c664950fea501f928cc9f0247f2b8f0 (patch) | |
tree | 99884746b315999b97f11122cacccdc2f419b69f /site | |
parent | 6824d67beb423d51d27b9f297f97c75f6298c183 (diff) |
Read validate-forms.js from assets.
Diffstat (limited to 'site')
-rw-r--r-- | site/content/docs/5.0/forms/validation.md | 26 | ||||
-rw-r--r-- | site/layouts/_default/docs.html | 4 | ||||
-rw-r--r-- | site/static/docs/5.0/assets/js/validate-forms.js (renamed from site/assets/js/validate-forms.js) | 4 |
3 files changed, 10 insertions, 24 deletions
diff --git a/site/content/docs/5.0/forms/validation.md b/site/content/docs/5.0/forms/validation.md index c505163624..d70507037b 100644 --- a/site/content/docs/5.0/forms/validation.md +++ b/site/content/docs/5.0/forms/validation.md @@ -4,6 +4,9 @@ title: Validation description: Provide valuable, actionable feedback to your users with HTML5 form validation, via browser default behaviors or custom styles and JavaScript. group: forms toc: true +extra_js: + - src: "/docs/5.0/assets/js/validate-forms.js" + async: true --- {{< callout warning >}} @@ -99,26 +102,9 @@ Custom feedback styles apply custom colors, borders, focus styles, and backgroun {{< /example >}} {{< example lang="js" show_preview="false" >}} -// Example starter JavaScript for disabling form submissions if there are invalid fields -(function () { - 'use strict'; - - // Fetch all the forms we want to apply custom Bootstrap validation styles to - var forms = document.querySelectorAll('.needs-validation'); - - // Loop over them and prevent submission - Array.prototype.slice.call(forms) - .forEach(function (form) { - form.addEventListener('submit', function (event) { - if (!form.checkValidity()) { - event.preventDefault(); - event.stopPropagation(); - } - - form.classList.add('was-validated'); - }, false); - }); -})(); +{{< js.inline >}} +{{- readFile (printf "site/static/docs/%s/assets/js/validate-forms.js" .Site.Params.docs_version) -}} +{{< /js.inline >}} {{< /example >}} ## Browser defaults diff --git a/site/layouts/_default/docs.html b/site/layouts/_default/docs.html index 01890869af..2e5bac7fcf 100644 --- a/site/layouts/_default/docs.html +++ b/site/layouts/_default/docs.html @@ -47,5 +47,9 @@ {{ partial "footer" . }} {{ partial "scripts" . }} + + {{ range .Page.Params.extra_js -}} + <script{{ with .async }} async{{ end }} src="{{ .src }}"></script> + {{- end -}} </body> </html> diff --git a/site/assets/js/validate-forms.js b/site/static/docs/5.0/assets/js/validate-forms.js index b79f63f2dc..f8fd583de4 100644 --- a/site/assets/js/validate-forms.js +++ b/site/static/docs/5.0/assets/js/validate-forms.js @@ -5,10 +5,6 @@ // Fetch all the forms we want to apply custom Bootstrap validation styles to var forms = document.querySelectorAll('.needs-validation') - if (!forms) { - return - } - // Loop over them and prevent submission Array.prototype.slice.call(forms) .forEach(function (form) { |