add orig-name to elements when _prepareArrayInputs and use it for name validation if it exists

Author: jayankaghosh

lib/web/mage/validation.js

@@ -1885,7 +1885,8 @@
          */
         _prepareArrayInputs: function () {
             /* Store original names for array inputs */
-            var originalElements = [];
+            var originalElements = [],
+                originalSubmitHandler = this.options.submitHandler;
 
             /* For all array inputs, assign index so that validation is proper */
             this.element.find('[name$="[]"]').each(function (key, input) {
@@ -1895,6 +1896,7 @@
                 originalName = input.attr('name');
                 name = originalName.replace('[]', '[' + key + ']');
                 $(input).attr('name', name);
+                $(input).attr('orig-name', originalName);
                 originalElements.push({
                     element: $(input),
                     name: originalName
@@ -1908,8 +1910,11 @@
             this.options.submitHandler = function (form) {
                 originalElements.forEach(function (element) {
                     element.element.attr('name', element.name);
+                    element.element.removeAttr('orig-name');
                 });
-                form.submit();
+                
+                /* Call the originalSubmitHandler if it's a function */
+                typeof originalSubmitHandler === 'function' && originalSubmitHandler(form);
             };
         },
 

lib/web/mage/validation/validation.js

@@ -49,10 +49,13 @@
         'validate-one-checkbox-required-by-name': [
             function (value, element, params) {
                 var checkedCount = 0,
+                    selector,
                     container;
 
                 if (element.type === 'checkbox') {
-                    $('[name="' + element.name + '"]').each(function () {
+                    /* If orig-name attribute is present, use it for validation. Else use name */
+                    selector =  = element.getAttribute('orig-name') ? '[orig-name="' + element.getAttribute('orig-name') + '"]' : '[name="' + element.name + '"]';
+                    $(selector).each(function () {
                         if ($(this).is(':checked')) {
                             checkedCount += 1;