Magento – magento 2: how to make validation on same name array input

form-validationmagento-2.1

I want a validation on same name array dynamic input textbox.Because Magento data-validate="{required:true}" is not work on same name so how to validate same name array input validation.I have following html data.How to validate same name in magento 2 ?

<input type="text" name="qty[]" class="input-text" />
<input type="text" name="qty[]" class="input-text" />
<input type="text" name="qty[]" class="input-text" />

Best Answer

To validate name array dynamic input text boxes , You need to mention array input field's index like following.

<input type="text" name="qty[0]" class="input-text" />
<input type="text" name="qty[1]" class="input-text" />
<input type="text" name="qty[2]" class="input-text" />

Related Solutions

Magento – Magento Validation for multiple fields

After few hours of experimenting I made some changes for previous code which works for my problem:

jQuery(document).ready(function () {
    Validation.add('validate-postcode', Translator.translate('Please enter a valid post code.'), function (v, elm) {
        var elem1 = jQuery(elm),
                relatedElem = jQuery('#' + elem1.attr('data-related-field')),
                passed;
        elem1.removeClass('validation-failed');
        elem1.removeClass('validation-passed');
        if (typeof relatedElem !== 'undefined') {
            relatedElem.removeClass('validation-failed');
            relatedElem.removeClass('validation-passed');
            passed = !Validation.get('IsEmpty').test(elem1.val()) &&
                    !Validation.get('IsEmpty').test(relatedElem.val()) &&
                    /^\d{3}$/.test(elem1.val()) &&
                    /^\d{2}$/.test(relatedElem.val());
            if (!passed) {
                relatedElem.addClass('validation-failed');
                elem1.addClass('validation-failed');
            }
        }
        return passed;
    });
});

Hope that help or inspire someone for better solution. "Document ready" was required due Translator.translate() existence. Translation of string "Please enter a valid post code." was added in jstranslator.xml file.

Magento 2 – Date Validation on Custom Form Frontend

You can do it using errorPlacement function,

   <script type="text/javascript">
    //added by navin
    require(['jquery','mage/mage'], function(){
        var dataForm = jQuery('#edit-form-validate');
        dataForm.mage('validation', {
             errorPlacement: function(error, element) {
                    var errorPlacement = element;
                    console.log(element.val());
                    if (element.val()) {

                        //do your custom validation code.....
                    }
                }

        });

    });   

    </script>

Best Answer

Related Solutions

Magento – Magento Validation for multiple fields

Magento 2 – Date Validation on Custom Form Frontend

Related Topic