2

I am using the jQuery Validation method "greaterThan" as described by Jon and Mike E. in Validate that end date is greater than start date with jQuery

But when I send over: EndDate: { greaterThan: "#StartDate" } The result message is 'Must be greater than #StartDate'. I would like to do something like EndDate: { greaterThan: ["#StartDate","Start Date"] }

But am unsure how to modify the "greaterThan" method. I tried changing the 'value' to 'options[0]' but that was a fail.

Any suggestions? Thanks. Sam.

Community
  • 1
  • 1
SC_Adams
  • 156
  • 1
  • 1
  • 13

2 Answers2

6

There is no such rule or method called greaterThan within the jQuery Validate plugin. The answer you referenced is merely using the plugin's .addMethod() method to create a custom rule called greaterThan.

Quote OP:

"But when I send over: EndDate: { greaterThan: "#StartDate" } The result message is 'Must be greater than #StartDate'. I would like to do something like EndDate: { greaterThan: ["#StartDate","Start Date"] }."

Your question is written very poorly. However, if I understood it correctly,

  • See the second example in the documentation, which correctly shows how to use multiple parameters within the function and error message.

  • Assuming you want to pass a second parameter in order to improve the error message, simply access this second parameter using {1} within the message.

  • Within the function, access the first parameter using params[0].

In other words...

When you declare your rule with multiple parameters as in this example...

rules: {
    field: {
        customRule: [x,y]
    }
} 

Inside jQuery.validator.addMethod("customRule", function(value, element, params){...}, "message"), the parameters are accessed as follows...

within the function:

params[0] equals x
params[1] equals y

within the message:

{0} equals "x"
{1} equals "y"

"Must be between {0} and {1}" will display as "Must be between x and y"


Assuming the function from the linked answer is correct, apply the edits as follows...

jQuery.validator.addMethod("greaterThan", function(value, element, params) {    
    if (!/Invalid|NaN/.test(new Date(value))) {
        return new Date(value) > new Date($(params[0]).val());
    }    
    return isNaN(value) && isNaN($(params[0]).val()) || (Number(value) > Number($(params[0]).val())); 
},'Must be greater than {1}.');

Declare the rule as you requested...

$("form").validate({
    rules: {
        EndDate: {
            greaterThan: ["#StartDate","Start Date"]
        }
    }
});

EDIT:

Based on comments, simply check to see if the first field is empty before doing anything else...

jQuery.validator.addMethod("greaterThan", function(value, element, params) {
    if ($(params[0]).val() != '') {    
        if (!/Invalid|NaN/.test(new Date(value))) {
            return new Date(value) > new Date($(params[0]).val());
        }    
        return isNaN(value) && isNaN($(params[0]).val()) || (Number(value) > Number($(params[0]).val()));
    };
    return true; 
},'Must be greater than {1}.');
Community
  • 1
  • 1
Sparky
  • 98,165
  • 25
  • 199
  • 285
  • 1
    I appreciate the detailed answer and will strive to improve my question formatting. Only issue is that if both fields are blank it sill throws 'must be greater.. ' message. – SC_Adams Jan 01 '14 at 20:34
  • @user2840184, clearly that's not something you asked about in your original question. Since you only asked about how to pass a parameter into the error message, that's what I solved for you. To solve your new question, you simply need to modify the function to check if the first field is empty. See my edits. I'll kindly ask that you update your question with this new information and then "accept" my answer. Thanks. – Sparky Jan 01 '14 at 23:03
3

Let make it simple.

use min and max methd.

amount: {
  min: 1,
  max: 10
}

refer to: https://jqueryvalidation.org/min-method/

Siwei
  • 19,858
  • 7
  • 75
  • 95