Merge pull request #44 from haacked/haacked/36-validate-radio-buttons

Add support for validating checkboxes/radio buttons

Pages/Index.cshtml

@@ -147,27 +147,6 @@
 <script src="/dist/aspnet-validation.js"></script>
 <script>
     const service = new aspnetValidation.ValidationService(console);
-
-    var customRequired = function (value, element) {
-
-        // Handle single and multiple checkboxes/radio buttons.
-        if (element.type.toLowerCase() === "checkbox" || element.type.toLowerCase() === "radio") {
-            const allElementsOfThisName = element.form.querySelectorAll("input[name='" + element.name + "']");
-            for (let i = 0; i < allElementsOfThisName.length; i++) {
-                if (allElementsOfThisName[i].checked === true) {
-                    return true;
-                }
-            }
-
-            return false;
-        }
-
-        // Use default required for all other field types.
-        return Boolean(value);
-    }
-
-    service.addProvider("required", customRequired);
-
     service.bootstrap();
 </script>
 </body>

dist/aspnet-validation.js

@@ -190,6 +190,19 @@ var MvcValidationProviders = /** @class */ (function () {
          * Validates whether the input has a value.
          */
         this.required = function (value, element, params) {
+            // Handle single and multiple checkboxes/radio buttons.
+            var elementType = element.type.toLowerCase();
+            if (elementType === "checkbox" || elementType) {
+                var allElementsOfThisName = Array.from(element.form.querySelectorAll("input[name='".concat(element.name, "'][type='").concat(elementType, "']")));
+                for (var _i = 0, allElementsOfThisName_1 = allElementsOfThisName; _i < allElementsOfThisName_1.length; _i++) {
+                    var element_1 = allElementsOfThisName_1[_i];
+                    if (element_1 instanceof HTMLInputElement && element_1.checked === true) {
+                        return true;
+                    }
+                }
+                return false;
+            }
+            // Default behavior otherwise.
             return Boolean(value);
         };
         /**

package.json

@@ -1,6 +1,6 @@
 {
   "name": "aspnet-client-validation",
-  "version": "0.8.7",
+  "version": "0.8.8",
   "description": "Enables ASP.NET MVC client-side validation, without jQuery!",
   "main": "dist/aspnet-validation.js",
   "style": "dist/aspnet-validation.css",

src/index.ts

@@ -100,6 +100,19 @@ export class MvcValidationProviders {
      * Validates whether the input has a value.
      */
     required: ValidationProvider = (value, element, params) => {
+        // Handle single and multiple checkboxes/radio buttons.
+        const elementType = element.type.toLowerCase();
+        if (elementType === "checkbox" || elementType) {
+            const allElementsOfThisName = Array.from(element.form.querySelectorAll(`input[name='${element.name}'][type='${elementType}']`));
+            for (let element of allElementsOfThisName) {
+                if (element instanceof HTMLInputElement && element.checked === true) {
+                    return true;
+                }
+            }
+
+            return false;
+        }
+        // Default behavior otherwise.
         return Boolean(value);
     }