From db002902da3a56db6d4d65ea8ae78212c91ea3a1 Mon Sep 17 00:00:00 2001
From: XhmikosR <xhmikosr@gmail.com>
Date: Tue, 3 Sep 2019 18:04:11 +0300
Subject: [PATCH] Tweak form validation snippet. (#29359)

* remove load event
* use `forEach` and `querySelectorAll`
* simplify check
---
 .../4.3/examples/checkout/form-validation.js  | 13 ++++++------
 site/content/docs/4.3/forms/validation.md     | 20 ++++++++++---------
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/site/content/docs/4.3/examples/checkout/form-validation.js b/site/content/docs/4.3/examples/checkout/form-validation.js
index 59291c8b39..f8fd583de4 100644
--- a/site/content/docs/4.3/examples/checkout/form-validation.js
+++ b/site/content/docs/4.3/examples/checkout/form-validation.js
@@ -2,14 +2,14 @@
 (function () {
   'use strict'
 
-  window.addEventListener('load', function () {
-    // Fetch all the forms we want to apply custom Bootstrap validation styles to
-    var forms = document.getElementsByClassName('needs-validation')
+  // 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.filter.call(forms, function (form) {
+  // Loop over them and prevent submission
+  Array.prototype.slice.call(forms)
+    .forEach(function (form) {
       form.addEventListener('submit', function (event) {
-        if (form.checkValidity() === false) {
+        if (!form.checkValidity()) {
           event.preventDefault()
           event.stopPropagation()
         }
@@ -17,5 +17,4 @@
         form.classList.add('was-validated')
       }, false)
     })
-  }, false)
 })()
diff --git a/site/content/docs/4.3/forms/validation.md b/site/content/docs/4.3/forms/validation.md
index bedaeba13a..29b9aeac5d 100644
--- a/site/content/docs/4.3/forms/validation.md
+++ b/site/content/docs/4.3/forms/validation.md
@@ -103,22 +103,24 @@ Custom feedback styles apply custom colors, borders, focus styles, and backgroun
 
 <script>
 // Example starter JavaScript for disabling form submissions if there are invalid fields
-(function() {
+(function () {
   'use strict';
-  window.addEventListener('load', function() {
-    // Fetch all the forms we want to apply custom Bootstrap validation styles to
-    var forms = document.getElementsByClassName('needs-validation');
-    // Loop over them and prevent submission
-    var validation = Array.prototype.filter.call(forms, function(form) {
-      form.addEventListener('submit', function(event) {
-        if (form.checkValidity() === false) {
+
+  // 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);
     });
-  }, false);
 })();
 </script>
 {{< /example >}}