Validation of fields with same name and class get "TypeError: e.validator.methods[o] is undefined"

Question

I have this HTML code:

<section id="variations_holder">
    <input type="text" name="field1" class="pprice" />
    <br/>
    <input type="text" name="field2" class="pprice" />
    <br/>
    <input type="submit" />
</section>

And this is the code I'm using to handle validation:

$('#variations_holder input.pprice').each(function() {
    $(this).rules('add', {
        required: true,
        number: true,
        messages: {
            required: "Debes introducir un precio de la variación",
            number: "El precio de la variación debe ser un valor numérico o decimal"
        }
    });
});

And it works, however when the HTML looks like this (notice input has the same name's):

<section id="variations_holder">
    <input type="text" name="field1" class="pprice" />
    <br/>
    <input type="text" name="field1" class="pprice" />
    <br/>
    <input type="submit" />
</section>

The same code stop working and cause this error:

TypeError: e.validator.methods[o] is undefined

How I can fix this issue?

This is derived from this question

Community · Accepted Answer · 2017-05-23 12:02:54Z

9

Quote OP:

"... the HTML looks like this (notice input has the same name's):"

<input type="text" name="field1" class="pprice" />
<input type="text" name="field1" class="pprice" />

"How I can fix this issue?"

For the fifth time...

You can NOT have multiple input elements with the same value for every `name` attribute.

Because the plugin will NOT be able to keep track of the elements; there is no solution and no workaround for this specification.

(a collection or "group" of checkbox or radio elements is considered as "one data input", so they can share a name but only within the group representing this single piece of form data.)

Quote OP:

"This is derived from this question"

Where in my answer to that same question, I said:

"... the jQuery Validate plugin requires that each input element contain a unique name attribute. This is how the plugin keeps track of elements. ..."

as well as in the very second comment on the OP, I said:

"You cannot have multiple elements with same name. jQuery Validate requires that the name be unique."

and in a comment on my answer, I said:

"However, each element must contain a unique name, no matter how the rules are created and applied."

and in my last comment on the OP, I said:

"... The jQuery Validate plugin needs unique names on data input elements because that's how the plugin keeps track of them internally. There is no way around this requirement."

Also see:

Sources:

edited May 23, 2017 at 12:02

CommunityBot

11 silver badge

answered Oct 9, 2013 at 21:56

Sparky

98.8k26 gold badges202 silver badges293 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

amigolargo Over a year ago

It's worth noting that radio button inputs can have the same name, as long as class rules are only applied to one of the inputs in the group. See [link] (stackoverflow.com/questions/21405138/…)

Sparky Over a year ago

@amigolargo, I assume the reader already knows that a "grouping" of radios or checkboxes usually represents a single input point as far as form data is concerned. And the same constraint applies. You cannot have two radio or checkbox groups with the same name.

amigolargo Over a year ago

It was just to clarify in case anyone read this post with the same problem I had been facing - how to apply class rules to radio button groups (only add the class to a single radio button within the group). This is not necessarily immediately apparent - no affront intended

Tobias · Accepted Answer · 2015-02-26 09:28:18Z

-1

I had the same problem and the solution in your case would be the following.

Plug-ins used:

HTML:

<input type="text" name="field1[]" class="pprice-group" />
<input type="text" name="field1[]" class="pprice-group" />

JS:

$("#form").validate({
    // Rules for form validation
    rules:
    {
        "field1[]":
        {
            require_from_group: [1, ".pprice-group"]
        }
    },

    // Messages for form validation
    messages:
    {
        "field1[]":
        {
            require_from_group: 'At least {0} field required'
        }

    }
});

edited Feb 26, 2015 at 9:28

answered Feb 26, 2015 at 8:34

Tobias

8407 silver badges12 bronze badges

1 Comment

Sparky Over a year ago

The require_from_group rule only makes it appear as if your solution is working properly. Otherwise, try using standard rules like required, minlength, etc. and the core issue becomes apparent: jsfiddle.net/he21scmw

Collectives™ on Stack Overflow

Validation of fields with same name and class get "TypeError: e.validator.methods[o] is undefined"

2 Answers 2

You can NOT have multiple input elements with the same value for every `name` attribute.

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

You can NOT have multiple input elements with the same value for every name attribute.

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related

You can NOT have multiple input elements with the same value for every `name` attribute.