jQuery Validation show input name in error message

Question

So I have this:

<input name="fname" id="fname" data-message-name="First Name" />

I'm running .validate() on this form and I have all the error placements correct, but I want ALL the messages (being dynamic.. not having to type them statically) to show the attribute data-message-name in the error message instead of saying 'this'.

Right now, I have this:

$('.validate-form').validate({
    wrapper: "li",
    errorPlacement: function(error, element) {
        error.appendTo( $(element.parents('form').attr('data-error-container')) );
    }
});

It spits out this error:

This field is required.

I want it to say:

First Name field is required.

I looked over the documentation and I can't seem to find where it goes into detail for this. I'm using this plugin to be exact: http://jqueryvalidation.org/documentation/

Thanks for any help.

Sparky · Accepted Answer · 2014-07-28 18:53:43Z

1

If you're searching the docs for this, you won't find it because it's not a feature of this plugin.

However, you can use element.attr('data-message-name') to get the text from your attribute and incorporate it into your message. I tried making a demo but it was unreliable and overly complex. (The reason has to do with how/when the errorPlacement callback function is called. Once the message is placed within the layout, the callback is not fired again but the message is simply toggled.)

Your best solution is the simplest. Just use the custom messages option as it was designed....

$('.validate-form').validate({
    rules: {
        fname: {
            required: true
        }
    },
    messages: {
        fname: {
            required: "First Name is required"
        }
    },
    ....
});

answered Jul 28, 2014 at 18:53

Sparky

98.8k26 gold badges202 silver badges293 bronze badges

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

Collectives™ on Stack Overflow

jQuery Validation show input name in error message

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related