Make blur fix work with separate submit button + add 'test'.

HenrikJoreteg · Apr 14, 2014 · 1ba902f · 1ba902f
1 parent ad17308
commit 1ba902f
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 1 deletion.
diff --git a/demo.html b/demo.html
@@ -22,6 +22,23 @@
                         }
                     }
                 });
+
+                $('#awesomeFormSubmitButton').isHappy({
+                    submitButton: '#submitTheForm',
+                    fields: {
+                        // reference the field you're talking about, probably by `id`
+                        // but you could certainly do $('[name=name]') as well.
+                        '#yourName-2': {
+                            required: true,
+                            message: 'Might we inquire your name'
+                        },
+                        '#email-2': {
+                            required: true,
+                            message: 'How are we to reach you sans email??',
+                            test: happy.email // this can be *any* function that returns true or false
+                        }
+                    }
+                });
             });
         </script>
         <style>
@@ -37,10 +54,19 @@
         </style>
     </head>
     <body>
+        <h1>Simple Form</h1>
         <form id="awesomeForm" action="/lights/camera" method="post">
             <input id="yourName" type="text" name="name" />
             <input id="email" type="text" name="email" class="" />
             <input type="submit" value="go" />
         </form>
+
+        <h1>With config.submitButton</h1>
+        <form id="awesomeFormSubmitButton" action="/lights/camera" method="post">
+            <input id="yourName-2" type="text" name="name" />
+            <input id="email-2" type="text" name="email" class="" />
+        </form>
+
+        <button id="submitTheForm">Submit the form</button>
     </body>
 </html>
diff --git a/happy.js b/happy.js
@@ -107,7 +107,7 @@
             processField(config.fields[item], item);
         }
 
-        this.bind('mousedown', function () {
+        $(config.submitButton || this).bind('mousedown', function () {
             submitPressed = true;
             $(window).bind('mouseup', function () {
                 submitPressed = false;