views:

169

answers:

1

I can't seem to get this right, I can get it to catch a past date, but not return true on future date.I just need to validate my form's Credit Card Expiration Date as being in the future, this isn't working, any ideas? the date has to be in the format MM/YYYY with a "/" in between them.

$.validator.addMethod(
"FutureDate",
function(value, element) {
    var startdatevalue = (.getMonth/.getYear);
    return Date.parse(startdatevalue) < Date.parse($("#ExpirationDate").val());
}, 
    "End Date should be greater than Start Date."
);
+1  A: 

You're not actually getting it to catch a past date. If you're passing a date like this "11/2010" to your Date.parse(), it is returning NaN (or Not a Number) which is the logical equivalent to returning false.

Try doing this to see what I mean:

alert( Date.parse('11/2010') );

If you add a day number, it should work. Something like:

var startdatevalue = '11/1/2010';

Of course, this example uses a hard coded date. If the values are stored as 11/2010, you could try something like this:

    // Get the index of the "/"
var separatorIndex = value.indexOf('/');

    // Add "/1" before the separatorIndex so we end up with MM/1/YYYY
var startDate = value.substr( 0, separatorIndex ) + '/1' + value.substr( separatorIndex );

    // Do the same with the expiration date
var expDate = $("#ExpirationDate").val();
separatorIndex = expDate.indexOf('/');
expDate = expDate.substr( 0, separatorIndex ) + '/1' + expDate.substr( separatorIndex );

    // Return the comparison
return Date.parse(startDate) < Date.parse(expDate);
patrick dw
@Patrick, I am testing with the above now. I'm not sure why I need to add the "/1" to the date. The date can only be entered as MM/YYYY and I just need to validate that the entered MM/YYYY is ahead of the current MM/YYYY
Dirty Bird Design
@Dirty - The reason is that `Date.parse()` does not accept the `MM/YYYY` format, so we're just adding in a day number to make it happy. It's just a temporary fix to make your desired format work with `Date.parse()`. It doesn't ultimately change the input value.
patrick dw
@Patrick - Interesting...Assuming you entered 07/2015 as the date, (I used the above code and stuck in an alert(startDate); and an alert(expDate); )Both dates are the same, except for instance, startDate val = 7/1/2015 and expDate = 07/2015. It returns false, it doesn't appear to be comparing the current (today's) date against the exp. date, even though return Date.parse....appears correct
Dirty Bird Design
@Dirty - If you're saying that you applied the fix to both dates, and it still returns `false`, that is because you're doing a "less than" comparison. To make it return true when the dates are equal, you need to compare "less than or equal to", as in `<=` instead of `<`.
patrick dw
@Patrick - almost, but it still just compares the date you entered as exp date to itself, it's not grabbing the date from anywhere. With the below code, it returns true for any date.
Dirty Bird Design
$.validator.addMethod("Future",function(value, element) { var separatorIndex = value.indexOf('/'); var startDate = value.substr( 0, separatorIndex ) + '/1' + value.substr( separatorIndex ); // Do the same with the expiration date var expDate = $("#ExpirationDate").val(); //alert(startDate); //alert(expDate); separatorIndex = expDate.indexOf('/'); expDate = expDate.substr( 0, separatorIndex ) + '/1' + expDate.substr( separatorIndex ); return Date.parse(startDate) <= Date.parse(expDate); }, "End Date should be greater than Start Date." );
Dirty Bird Design
@Dirty - The code works for me. Try it out here: http://jsfiddle.net/z6jYM/ and change the start month.
patrick dw
@Patrick - sorry for being so dense here. I took a look at the posted code and added a submit btn to test the functionality. I need the 'startDate' to be today's date and generated dynamically I need to compare that to "expDate" and make sure that "expDate" is greater than "startDate" I don't see this doing that, when I remove value from "startDate' and try and include it as var Today = newDate, it does nothing.
Dirty Bird Design
@Dirty - Now I think I see. Try this: http://jsfiddle.net/CpG93/ This example populates `startDate` with the date of the first day of this month so you get an accurate comparison between dates.
patrick dw
@Patrick - awesome. I really appreciate the help, I have a lot to learn! If it's cool, Id like to ask a question so I can truly understand this code. In the var "startDate" I assume this is where you are formatting the date to be mont/year? what is the 1,0,0,0,0? then you just parse out the "separatorIndex"? I don't get that part either. As much detail as you care to go into would be awesome. Really appreciate it man.
Dirty Bird Design
@Dirty - The `1,0,0,0,0` represents `day,hours,minutes,seconds,milliseconds` for the new date. It may be possible to leave the zeros off. Haven't tried. We wanted to end up with the first day of this month to compare to the expiration date. Since `.parseDate()` gives us the number of milliseconds since January 1, 1970, we need to be accurate down to the millisecond for it to work. As far as the `separatorIndex` We're just parsing that out of the expiration date's `MM/YYYY` so we can know where to place the `/1`. So the first `substr()` gives us the characters from the start through the...
patrick dw
Awesome, thank you.
Dirty Bird Design
...character just before the `/`. Then we concatenate in the `/1` and then the second `substr()` which gives us the characters from the `/` to the end, so we end up with `07 + /1 + /2010` to create our complete date for `parseDate()`. If you're absolutely sure that you will always have a 2 digit Month, then you could skip that and use the number `2` in the `substr()` calls in place of `separatorIndex`.
patrick dw
@Dirty - Just wanted to make sure you got the second half of the explanation. I ran out of room in the first comment. You're welcome. :o)
patrick dw