ENGCOM-5174: issue fixed #8258 - assign indices for all array inputs so that validation works properly #15383

sivaschenko · web-flow · commit 01982dc4e733 · 2019-07-06T21:51:45.000+01:00
diff --git a/dev/tests/functional/tests/app/Magento/CheckoutAgreements/Test/Block/Adminhtml/Block/Agreement/Edit/AgreementsForm.xml b/dev/tests/functional/tests/app/Magento/CheckoutAgreements/Test/Block/Adminhtml/Block/Agreement/Edit/AgreementsForm.xml
@@ -18,7 +18,7 @@
             <input>select</input>
         </mode>
         <stores>
-            <selector>[name="stores[]"]</selector>
+            <selector>[name="stores[0]"]</selector>
             <input>multiselectgrouplist</input>
         </stores>
         <checkbox_text />
diff --git a/dev/tests/functional/tests/app/Magento/Customer/Test/Block/Form/CustomerForm.php b/dev/tests/functional/tests/app/Magento/Customer/Test/Block/Form/CustomerForm.php
@@ -29,7 +29,7 @@ class CustomerForm extends Form
      *
      * @var string
      */
-    protected $customerAttribute = "[name='%s[]']";
+    protected $customerAttribute = "[orig-name='%s[]']";
 
     /**
      * Validation text message for a field.
diff --git a/dev/tests/functional/tests/app/Magento/Newsletter/Test/Block/Adminhtml/Queue/Edit/QueueForm.xml b/dev/tests/functional/tests/app/Magento/Newsletter/Test/Block/Adminhtml/Queue/Edit/QueueForm.xml
@@ -11,7 +11,7 @@
             <selector>input[name='start_at']</selector>
         </queue_start_at>
         <stores>
-            <selector>select[name="stores[]"]</selector>
+            <selector>select[name="stores[0]"]</selector>
             <input>multiselectgrouplist</input>
         </stores>
         <newsletter_subject>
diff --git a/dev/tests/functional/tests/app/Magento/Reports/Test/Block/Adminhtml/Sales/Coupons/Filter.xml b/dev/tests/functional/tests/app/Magento/Reports/Test/Block/Adminhtml/Sales/Coupons/Filter.xml
@@ -29,7 +29,7 @@
             <input>select</input>
         </price_rule_type>
         <order_statuses>
-            <selector>[name="order_statuses[]"]</selector>
+            <selector>[name="order_statuses[0]"]</selector>
             <input>multiselect</input>
         </order_statuses>
         <rules_list>
diff --git a/dev/tests/functional/tests/app/Magento/Reports/Test/Block/Adminhtml/Sales/TaxRule/Filter.xml b/dev/tests/functional/tests/app/Magento/Reports/Test/Block/Adminhtml/Sales/TaxRule/Filter.xml
@@ -23,7 +23,7 @@
             <input>select</input>
         </show_order_statuses>
         <order_statuses>
-            <selector>[name="order_statuses[]"]</selector>
+            <selector>[name="order_statuses[0]"]</selector>
             <input>multiselect</input>
         </order_statuses>
         <show_empty_rows>
diff --git a/dev/tests/functional/tests/app/Magento/Review/Test/Block/Adminhtml/Rating/Edit/RatingForm.xml b/dev/tests/functional/tests/app/Magento/Review/Test/Block/Adminhtml/Rating/Edit/RatingForm.xml
@@ -12,7 +12,7 @@
         <strategy>css selector</strategy>
         <fields>
             <stores>
-                <selector>[name="stores[]"]</selector>
+                <selector>[name="stores[0]"]</selector>
                 <input>multiselectgrouplist</input>
             </stores>
             <is_active>
diff --git a/dev/tests/functional/tests/app/Magento/Sales/Test/Block/Adminhtml/Report/Filter/Form.xml b/dev/tests/functional/tests/app/Magento/Sales/Test/Block/Adminhtml/Report/Filter/Form.xml
@@ -26,7 +26,7 @@
             <input>select</input>
         </show_order_statuses>
         <order_statuses>
-            <selector>[name="order_statuses[]"]</selector>
+            <selector>[name="order_statuses[0]"]</selector>
             <input>multiselect</input>
         </order_statuses>
         <show_actual_columns>
diff --git a/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/Widget/Instance/Edit/Tab/ParametersType/RecentlyComparedProducts.xml b/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/Widget/Instance/Edit/Tab/ParametersType/RecentlyComparedProducts.xml
@@ -12,13 +12,13 @@
         </page_size>
         <show_attributes>
             <selector>
-                .control [name="parameters[show_attributes][]"]
+                .control [name="parameters[show_attributes][1]"]
             </selector>
             <input>multiselect</input>
         </show_attributes>
         <show_buttons>
             <selector>
-                .control [name="parameters[show_buttons][]"]
+                .control [name="parameters[show_buttons][2]"]
             </selector>
             <input>multiselect</input>
         </show_buttons>
diff --git a/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/Widget/Instance/Edit/Tab/ParametersType/RecentlyViewedProducts.xml b/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/Widget/Instance/Edit/Tab/ParametersType/RecentlyViewedProducts.xml
@@ -12,13 +12,13 @@
         </page_size>
         <show_attributes>
             <selector>
-                .control [name="parameters[show_attributes][]"]
+                .control [name="parameters[show_attributes][1]"]
             </selector>
             <input>multiselect</input>
         </show_attributes>
         <show_buttons>
             <selector>
-                .control [name="parameters[show_buttons][]"]
+                .control [name="parameters[show_buttons][2]"]
             </selector>
             <input>multiselect</input>
         </show_buttons>
diff --git a/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/WidgetForm.xml b/dev/tests/functional/tests/app/Magento/Widget/Test/Block/Adminhtml/WidgetForm.xml
@@ -32,13 +32,13 @@
         <page_size />
         <show_attributes>
             <selector>
-                .control [name="parameters[show_attributes][]"]
+                .control [name="parameters[show_attributes][1]"]
             </selector>
             <input>multiselect</input>
         </show_attributes>
         <show_buttons>
             <selector>
-                .control [name="parameters[show_buttons][]"]
+                .control [name="parameters[show_buttons][2]"]
             </selector>
             <input>multiselect</input>
         </show_buttons>
diff --git a/lib/web/mage/validation.js b/lib/web/mage/validation.js
@@ -1925,6 +1925,7 @@
          * @protected
          */
         _create: function () {
+            this._prepareArrayInputs();
             this.validate = this.element.validate(this.options);
 
             // ARIA (adding aria-required attribute)
@@ -1937,8 +1938,53 @@
             this._listenFormValidate();
         },
 
+        /**
+         * Validation creation.
+         *
+         * @protected
+         */
+        _prepareArrayInputs: function () {
+            /* Store original names for array inputs */
+            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) {
+                var originalName, name;
+
+                input = $(input);
+                originalName = input.attr('name');
+                name = originalName.replace('[]', '[' + key + ']');
+                $(input).attr('name', name);
+                $(input).attr('orig-name', originalName);
+                originalElements.push({
+                    element: $(input),
+                    name: originalName
+                });
+            });
+
+            if (originalElements.length) {
+                /**
+                 *  Before submitting the actual form, remove the previously assigned indices
+                 *  @param {Object} form
+                 */
+                this.options.submitHandler = function (form) {
+                    originalElements.forEach(function (element) {
+                        element.element.attr('name', element.name);
+                        element.element.removeAttr('orig-name');
+                    });
+
+                    console.error(this.submit);
+
+                    /* Call the originalSubmitHandler if it's a function */
+                    typeof originalSubmitHandler === 'function' ? originalSubmitHandler(form) : form.submit();
+                };
+            }
+        },
+
         /**
          * Validation listening.
+         *
          * @protected
          */
         _listenFormValidate: function () {
diff --git a/lib/web/mage/validation/validation.js b/lib/web/mage/validation/validation.js
@@ -49,10 +49,17 @@
         'validate-one-checkbox-required-by-name': [
             function (value, element, params) {
                 var checkedCount = 0,
-                    container;
+                    selector,
+                    container,
+                    origNameSelector,
+                    nameSelector;
 
                 if (element.type === 'checkbox') {
-                    $('[name="' + element.name + '"]').each(function () {
+                    /* If orig-name attribute is present, use it for validation. Else use name */
+                    origNameSelector = '[orig-name="' + element.getAttribute('orig-name') + '"]';
+                    nameSelector = '[name="' + element.name + '"]';
+                    selector = element.getAttribute('orig-name') ? origNameSelector : nameSelector;
+                    $(selector).each(function () {
                         if ($(this).is(':checked')) {
                             checkedCount += 1;
 

Original file line number	Diff line number	Diff line change
`@@ -29,7 +29,7 @@ class CustomerForm extends Form`
`29`	`29`	`*`
`30`	`30`	`* @var string`
`31`	`31`	`*/`
`32`		`- protected $customerAttribute = "[name='%s[]']";`
	`32`	`+ protected $customerAttribute = "[orig-name='%s[]']";`
`33`	`33`
`34`	`34`	`/**`
`35`	`35`	`* Validation text message for a field.`