'Formvalidation.io and array input fields with index

I am using the Formvalidation.io plugin and this works perfect with

<input type="text" name="url[]" required />

with the following validation code

'url[]': {
    validators: {
        stringLength: {
             min: 4
        }
    }
 },

But when using a "predefined" index

<input type="text" name="url[1]" required />

the following validation doesn't work

'url[]': {
    validators: {
        stringLength: {
             min: 4
        }
    }
 },

It works using a fixed index in the validation code (see below code)

'url[1]': {
    validators: {
        stringLength: {
             min: 4
        }
    }
 },

However I am dynamically adding fields with an unknown index. So using a fixed index in the validation code is not an option.

arraysindexingformvalidation.io


Solution 1:[1]

I think the answer of what you're looking for is on this page and then the second section "Inputs with different names".

There you can validate on the css class of you're flied

 <fieldname>: {
                    //the input css class
                    selector: '<.cssClass>',
                    // The field is placed inside .col-xs-6 div instead of .form-group
                    row: '.col-xs-6',
                    validators: {
                        <your validator>
                    }
                }

Solution 2:[2]

With formvalidation.io version 1.9.0, this is what works for me:

<input type="text" name="myvar[1]" />
<input type="text" name="myvar[2]" />
<input type="text" name="myvar[3]" />

Use the selector option to validate all variable names that start with "myvar["

'this_can_be_anything': {
    selector: 'input[name^="myvar["]',
    validators: {
        stringLength: {
             min: 4
        }
    }
 },

More details can be found here: https://formvalidation.io/guide/getting-started/field-selector/

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Casper Schobers
Solution 2

Related Questions