]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
projects / thirdparty / foundation / foundation-sites.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 99738a3)
Abide: don't validate hidden fields, skip ignored fields at validation time 8770/head
authorSteve Hull <p.witty@gmail.com>
Wed, 11 May 2016 06:46:45 +0000 (23:46 -0700)
committerSteve Hull <p.witty@gmail.com>
Wed, 11 May 2016 06:46:45 +0000 (23:46 -0700)
js/foundation.abide.js patch | blob | blame | history
test/javascript/components/abide.js patch | blob | blame | history
test/visual/abide/hidden_and_ignored_fields.html [new file with mode: 0644] patch | blob

diff --git a/js/foundation.abide.js b/js/foundation.abide.js
index 0196a4db34958258a96aaac2c481dffa23c5df51..3ff52a27ace449df79f7735c638da43c946ac342 100644 (file)
--- a/js/foundation.abide.js
+++ b/js/foundation.abide.js
@@ -29,7 +29,7 @@ class Abide {
    * @private
    */
   _init() {
-    this.$inputs = this.$element.find('input, textarea, select').not('[data-abide-ignore]');
+    this.$inputs = this.$element.find('input, textarea, select');
 
     this._events();
   }
@@ -242,6 +242,11 @@ class Abide {
         validator = $el.attr('data-validator'),
         equalTo = true;
 
+    // don't validate ignored inputs or hidden inputs
+    if ($el.is('[data-abide-ignore]') || $el.is('[type="hidden"]')) {
+      return true;
+    }
+
     switch ($el[0].type) {
       case 'radio':
         validated = this.validateRadio($el.attr('name'));
diff --git a/test/javascript/components/abide.js b/test/javascript/components/abide.js
index 78be9efd83599cd4aea00f13e8e2a2dad1b85e22..b476bfe9269b65d6a6230033f96e1a4f9c6326be 100644 (file)
--- a/test/javascript/components/abide.js
+++ b/test/javascript/components/abide.js
@@ -1,20 +1,39 @@
+/* jslint mocha: true */
+/*global describe, it, before, beforeEach, after, afterEach, $, Foundation */
+
 describe('Abide', function() {
   var plugin;
   var $html;
 
-  // afterEach(function() {
-  //   plugin.destroy();
-  //   $html.remove();
-  // });
+  afterEach(function() {
+    plugin.destroy();
+    $html.remove();
+  });
 
   describe('constructor()', function() {
-    // it('', function() {
-    //   $html = $('').appendTo('body');
-    //   plugin = new Foundation.Abide($html, {});
+    it('stores the element & plugin options', function() {
+      $html = $('<form data-abide novalidate></form>').appendTo('body');
+      plugin = new Foundation.Abide($html, {});
+
+      plugin.$element.should.be.an('object');
+      plugin.options.should.be.an('object');
+    });
+  });
+
+  describe('validateInput()', function() {
+    it('returns true for hidden inputs', function() {
+      $html = $("<form data-abide novalidate><input type='hidden' required></form>").appendTo("body");
+      plugin = new Foundation.Abide($html, {});
+
+      plugin.validateInput($html.find("input")).should.equal(true);
+    });
+
+    it('returns true for inputs with [data-abide-ignore]', function() {
+      $html = $("<form data-abide novalidate><input type='text' required data-abide-ignore></form>").appendTo("body");
+      plugin = new Foundation.Abide($html, {});
 
-    //   plugin.$element.should.be.an('object');
-    //   plugin.options.should.be.an('object');
-    // });
+      plugin.validateInput($html.find("input")).should.equal(true);
+    });
   });
 
-});
\ No newline at end of file
+});
diff --git a/test/visual/abide/hidden_and_ignored_fields.html b/test/visual/abide/hidden_and_ignored_fields.html
new file mode 100644 (file)
index 0000000..5c9bf34
--- /dev/null
+++ b/test/visual/abide/hidden_and_ignored_fields.html
@@ -0,0 +1,51 @@
+<!doctype html>
+<!--[if IE 9]><html class="lt-ie10" lang="en" > <![endif]-->
+<html class="no-js" lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>Foundation for Sites Testing</title>
+    <link href="../assets/css/foundation.css" rel="stylesheet" />
+  </head>
+  <body>
+  <div class="row column">
+    <h1>Abide: Hidden and Ignored Fields</h1>
+    <div class="callout">
+      <p>This form has a hidden field and a required text field.</p>
+      <p>Errors should be displayed properly.</p>
+
+      <form data-abide novalidate>
+        <input required type="text" placeholder="Required - try submitting without a value">
+        <span class='form-error'>This field is required</span>
+        <input type="hidden" value="foo">
+        <button type="submit" class="button">Submit</button>
+        <button type="reset" class="button">Reset</button>
+      </form>
+    </div>
+    <div class="callout">
+      <p>This form has a required text field and an ignored field that is ignored after page load.</p>
+      <p>The ignored field should be ignored.</p>
+      <form data-abide novalidate>
+        <div class="row column">
+          <input required type="text" placeholder="Required">
+          <span class='form-error'>This field is required</span>
+        </div>
+        <div class="row column">
+          <input required id="ignoreAfter" type="text" placeholder="Ignored">
+          <span class='form-error'>You should never see this error!</span>
+        </div>
+        <button type="submit" class="button">Submit</button>
+        <button type="reset" class="button">Reset</button>
+      </form>
+    </div>
+  </div>
+
+    <script src="../assets/js/vendor.js"></script>
+    <script src="../assets/js/foundation.js"></script>
+    <script>
+      Foundation.Abide.defaults.patterns['customPattern'] = /^\w{4,16}$/;
+      $(document).foundation();
+      $("#ignoreAfter").attr("data-abide-ignore", true);
+    </script>
+  </body>
+</html>
Mirror of https://github.com/foundation/foundation-sites.git