0

I need change default error message of jQuery Validation Plugin. I have learned how to achieve this from here, and this working great. However i need some more customazation. Is it possible to set different error messages based on type of input field. I mean, for:

<input type="text" required>

default error massege should be "Filling this field is required". And for 

<input type="file" required>

default error massege should be "Attaching document is required". I know that I can set error messages separately for fields like this:

$('form').validate({                
    messages: {
        FieldName: { required: "Attaching document is required" }
    }
});

Problem is that, the form is really huge, so I thought writing separate error messages would not be good solution.

Community
  • 1
  • 1
Mansur Anorboev
  • 580
  • 1
  • 7
  • 17

2 Answers2

1

You would use the .rules('add') method combined with a jQuery .each() to globally change the error messages based on type.

$('input[type="text"]').each(function() {
    $(this).rules('add', {
        messages: {
            required: "this TEXT field is required"
        }
    })
});

$('input[type="file"]').each(function() {
    $(this).rules('add', {
        messages: {
            required: "this FILE upload field is required"
        }
    })
});

DEMO: jsfiddle.net/cftesLwd/

My demo shows that you can use this method to change the message even in cases where you don't use this method to declare the rule itself. Messages only show up on fields that contain the required attribute. Otherwise, you can also easily declare the required rule for all inputs of these types even when you don't have the inline required attribute.

Sparky
  • 98,165
  • 25
  • 199
  • 285
-2

Give each input field a different name and create validation rules individually for names

Suppose you have 2 fields:

<input type="text" name="textfield" required>
<input type="file" name="filefield" required>

then your validation messages will be:

var validator = $("form").validate({
rules: {
    textfield: "required",
    filefield: "required",
},
messages: {
    textfield: "Filling this field is required",
    textfield: "Attaching document is required",
}
}
Tommy Nguyen
  • 96
  • 1
  • 5
  • Thank you for answer, but please read question one more time. I've explained why given solution is not acceptable – Mansur Anorboev Apr 10 '17 at 09:19
  • I have 1 workaround for your situation. You don't have to declare messages for each field, but I suppose you have 'name' attribute has been set for all fields. Then loop through all fields, check the field types and build an object for the value of validator.messages. Something like that: `if (field.attr("type") == 'text' ) { msgObj[field.attr("name")] = "Filling this field is required" }` , after that: `validator.messages = msgObj;` – Tommy Nguyen Apr 10 '17 at 12:15
  • *"I have 1 workaround"* ~ No need; there's already a built-in method. Also, when using the `required` attribute on the input, it's totally redundant and superfluous to also put the declaration within the `rules` object. – Sparky Apr 10 '17 at 14:38