jquery validator addmethod custom message

Question

I've created a method for jquery's validator plugin, that works like the remote rule. The difference is that I'd like to display a dynamic error message (based on the ajax response).

jQuery.validator.addMethod("duplicate", function(value, element, params) { 
    var object_settings = this.settings;
    params.data[$(element).attr("name")] = value;
    $.post(params.url, params.data, function(response) {
        if (response == 'true'){ return true; }
        else {
            object_settings.messages[element.name] = response;
            return false;
        }
    }, 'text');
}, '');

It works...sort of....it sets the message, but doesn't display it initially (if you validate the field a second time, the message is displayed).

Any suggestions?

(maybe the remote rule offers this functionality...I couldn't find anything in the documentation)

timborden · Accepted Answer · 2009-06-11 12:53:07Z

15

Here's the solution....needed to call the showErrors function of the object:

jQuery.validator.addMethod("duplicate", function(value, element, params) { 
    var validator = this;
    params.data[element.name] = value;
    $.post(params.url, params.data, function(response) {
        if (response == 'true'){ return true; }
        else {
            var errors = {};
            errors[element.name] =  response;
            validator.showErrors(errors);
            return false;
        }
    }, 'text');
}, '');

Taken from "remote" in jquery.validate.js (lines 917 - 919)

edited Jun 11, 2009 at 12:53

answered Jun 10, 2009 at 17:40

timborden

1,4804 gold badges18 silver badges24 bronze badges

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

1 Comment

aqs Over a year ago

The default error message is over writing the custom message, when I do this.

Community · Accepted Answer · 2014-10-10 14:29:53Z

11

I have followed the process mentioned in the site http://blogs.teamb.com/craigstuntz/2009/01/15/37923/#comment-125774 and succeeded.

You have to call the method with the dynamic message, so that it will display that message. For example

$.validator.addMethod("validatePremium", function(value, element, param) {

    if( Condition )    

     {
       $.validator.messages.validatePremium = "your message here";
       //enter code here
       //...
       return false;
     }

    }, $.validator.messages.validatePremium);

edited Oct 10, 2014 at 14:29

CommunityBot

11 silver badge

answered Nov 27, 2013 at 10:44

Kiran

1,2074 gold badges19 silver badges35 bronze badges

1 Comment

Plasebo Over a year ago

Best answer for me, solve my issue with a charm: Link : codepen.io/plasebo/pen/VGaQam Thanks Kiran

jeff · Accepted Answer · 2012-11-26 00:24:21Z

9

Was looking for solution to this as well, and found this...

In the original example, if you change this line:

object_settings.messages[element.name] = response;

To this:

$.validator.messages.duplicate = response;

This works for me. I found it here: http://blogs.teamb.com/craigstuntz/2009/01/15/37923/

edited Nov 26, 2012 at 0:24

jeff

8,3582 gold badges34 silver badges43 bronze badges

answered Jan 11, 2011 at 4:08

jsherk

6,5329 gold badges62 silver badges90 bronze badges

Comments

Tharindu · Accepted Answer · 2015-10-02 10:18:09Z

this worked for me

var errorMsg = '', $valid = false;
$.validator.addMethod("methodName",function(val, elem){
   $.ajax({
      url:'your_script.php',
      type:"POST",
      dataType:"json",
      data : {},
      success:function(response){
         if(response.success == false){
            errorMsg = response.msg;
            $valid = response.success;
         }
         else{
            $valid = true;
         }
      }
   });
   $.validator.messages["methodName"] = errorMsg;
   return $valid;
},'');

make sure to replace "methodName" with your method name in this case "duplicate" in both places(addMethod function 1st arg and in the addMethod function body $.validator.messages["methodName"])

Raibel Botta Rigores · Accepted Answer · 2023-01-22 17:35:52Z

0

You can customize the error message per validation method and per element, just as the plugin says:

// Adding validation method
$.validator.addMethod('sampleminimum', function (val, element, params) {
    return this.optional(element) || $(element).val() > params.min;
}, function(params, element) {
   return 'The field value cannot be less than %1'.replace('%1', params.min);
});

// Using validation
$(form).validate({
    rules: {
        'elementName': {
            sampleminimum: {min: 10}
        }
    }
});

answered Jan 22, 2023 at 17:35

Raibel Botta Rigores

1

Collectives™ on Stack Overflow

jquery validator addmethod custom message

5 Answers 5

1 Comment

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related