Remove Name Based jQuery Validation

Question

I'm trying to use the jQuery validation plugin to validate forms, but I need to completely remove the ability for it to use the name attribute. Part of my form is created dynamically based on a counter being incremented and I simply want to use classes only.

Is there a way to do this?

I've implemented the addClassRules method and added all my classes for each field, but if I remove the class from the field it still validates based on the name field.

This is really starting to get frustrating.

jQuery.validator.addClassRules({
    username: { 
        required: true, 
        minlength: 2, 
        remote: "whatever.php" 
    }
});

etc.

<div class="control-group">
    <label class="control-label" for="username">
        <?php echo $entry_username; ?>
    </label>
    <div class="controls">
        <input type="text" class="input-large" 
               name="username" id="username" 
               value="<?php echo $username; ?>" required>
    </div>
</div>

As you can see this element does NOT have a class of username, but the validation falls back to use the name attribute if the class isn't present.

I want to use classes ONLY for validation.

Thanks.

Its even more frustrating for others to see questions they cant understand. So yes, please add some code pieces/a fiddle perhaps to get your question across. — BuddhiP, Dec 06 '12 at 01:49
Not sure why this question requires code ... I'm not asking for code to be debugged, I'm asking how to turn off the name attribute fallback, but ... code added anyway. — secondman, Dec 06 '12 at 01:58

score 4 · Accepted Answer · answered Dec 17 '12 at 06:26

Use the built-in rules() method to add rules and assign them by class. See documentation.

Note: You must call this method after you call .validate().

I have a very large form where the user can dynamically add fields. This is the exact method I use to make sure my newly created fields are also part of the validation.

(If you remove the class from the input, it will not (can not) validate on the name attribute because the name attribute is not used anywhere within the .validate() options or rules.)

HTML:

<form id="form">
    <input type="text" class="myclass" name="whatever" />
</form>

jQuery:

$("#form").validate({
    // my options
});

// the following method must come AFTER .validate()
$('#form').find('.myclass').each(function() {
    $(this).rules('add', {
        required: true,
        minlength: 5,
        messages: {
            required: "Required input",
            minlength: jQuery.format("At least {0} characters are necessary")
        }
    });
});

jsFiddle DEMO

bazinga.. this saved me like 2 days of headaches. Freaking asp.net and their changing of the name property. I came up with a solution to change the name properties using jquery but then i broke viewstate. This works perfect. I saw something like this before but didn't realize you could attach messages too. — KingOfHypocrites, Sep 13 '13 at 20:53

score -1 · Answer 2 · answered Dec 06 '12 at 01:51

Simply download the source, e.g., http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.js, and then,
Do a search replace for the word name and replace it with another attribute, like validate_on
Use that new source in place of the old one.

score -1 · Answer 3 · answered Dec 06 '12 at 02:05

-1

What if you use a specific class name just for validation? Something that is different from name?

For example: validatable-username (Doesn't have to be that long, but you get my idea)

Then it can't fallback to the name.

answered Dec 06 '12 at 02:05

BuddhiP

6,231
5
36
56

Remove Name Based jQuery Validation

3 Answers3