I have the following code that validates a credit card expiration date, from 2 separate select boxes as being valid. I would appreciate some help changing this to an addMethod for the validation plug in. I have one that works as validating input from a text input, but would like to understand this method when applied to values of select boxes. Code for change function
$(document).ready(function() {
var minMonth = new Date().getMonth() + 1;
var minYear = new Date().getFullYear();
$("#ccexp select").change(function() {
var $month = $(this).closest("#ccexp").children("select:eq(0)");
var $year = $(this).closest("#ccexp").children("select:eq(1)");
var $span = $(this).nextAll("span");
if ($month.val() === "Month" || $year.val() === "Year") {
$span.removeClass().html("// Enter the expiration date");
} else {
var month = parseInt($month.children(":selected").attr("val"), 10);
var year = parseInt($year.val(), 10);
if ((year > minYear) || ((year === minYear) && (month >= minMonth))) {
$span.removeClass().addClass("ok").html("// OK");
} else {
$span.removeClass().addClass("invalid").html("// Invalid date");
}
}
});
});
---------- What I have that isn't working --------------
$validator.addMethod(
"CCExp",
function(value, element) {
var minMonth = new Date().getMonth() +1;
var minYear = new Date().getFullYear();
var $month = $(this).closest("#ccexp").children("select:eq(0)");
var $year = $(this).closest("#ccexp").children("select:eq(1)");
var $span = $(this).nextAll("span");
var month = parseInt($month.children(":selected").attr("val"), 10);
var year = parseInt($year.val(), 10);
if ((year > minYear) || ((year === minYear) && (month >= minMonth))) {
return true;
} else {
return false; }
}
},
"Your Credit Card Expiration date is invalid."
);
Of note: format HAS to be MM/YYYY for it to sync with back end WCF service. I will combine the value's and submit as the parameter "CreditExp" like this $("CreditExp").val('$('#month').val()' + $('#year').val()); assuming we use #month and #year for the respective select boxes. Is that correct
Would it be simpler to give the month and year select boxes ID's so I don't have to traverse the DOM to find them? Help is always appreciated Kane Leins