Casey H Casey H - 2 years ago 76
Javascript Question

Using Javascript to subtract two dates given from form entries

I'm trying to use javascript to subtract two dates. The date values come from form fields. I'm using Formidable Pro on a WordPress site for the form.

The form is one to allow a business to pay taxes. The taxes are due on the 20th of each month. Sometimes a business may pay their taxes late, so at the beginning of the form they specify what month they are paying taxes for.

The first date is the current date. It's populated into the form field using Formidable short code in the format mm/dd/yyyy.

The second date is calculated from from entries for Year and Month. Those values are then concatenated with "20" to form a full date value for the 20th of the month for which they are paying taxes.

If they are paying taxes on or before the 20th, there is no penalty. If it's after 20th, there's a penalty. I want to subtract the dates and then determine whether the payment is late based on the difference being greater than zero--and that difference value being populated into a form field.

This is the code I've been using. You'll see where I commented out one method of calculating and returning the difference value into the form.

With the code below, the script returns a "NaN" error into the difference field.

Why? How do I fix the error and have it report the difference? All I need to know is if its negative or >= zero.

<script type="text/javascript">
$('#field_21nfg, #field_o1ns5').change(function(){
var Year = $("#field_21nfg").val();
var Month = $("#field_o1ns5").val();


// var Due = $("#field_tm25b5").val();
// var Today = $("#field_1pjvu").val();
// var dDue = new Date('Due');
// var dToday = new Date('Today');
// var diff = Math.floor(dDue - dToday);

// $("#field_smmyr").val(diff);

var oneDay = 24*60*60*1000;

var Today_str = $("#field_1pjvu").val(); // E.g., "mm/dd/yyyy";
var Today_dt = new Date(parseInt(Today_str.substring(6), 10), // Year
parseInt(Today_str.substring(0, 2), 10) - 1, // Month (0-11)
parseInt(Today_str.substring(3, 5), 10)); // Day

var Due_str = $("#field_tm25b5").val(); // E.g., "mm/dd/yyyy";
var Due_dt = new Date(parseInt(Due_str.substring(6), 10), // Year
parseInt(Due_str.substring(0, 2), 10) - 1, // Month (0-11)
parseInt(Due_str.substring(3, 5), 10)); // Day

//var diff = Math.floor(Due_dt-Today_dt);
var diffDays = Math.round(Math.abs((Today_dt.getTime() - Due_dt.getTime())/(oneDay)));



"1pjvu" is the key of the today's date field

"21nfg" is the year value field of the billing period given by the user.

"o1ns5" is the month value field of the billing period field given by the user.

"tm25b" is the concatenated due date: the 20th of the month given in the above field.

"smmyr" is the key of the difference field.

UPDATE April 19 2016

Thank you all for your help. If you can't tell, I don't know JS but am hacking my way along as I go. After much fumbling, I got it to work. Here's my final code:

<script type="text/javascript">
$('#field_21nfg, #field_o1ns5').change(function(){

var Year = $("#field_21nfg").val(); //Collect value from Filing Period Year form field
var Month = $("#field_o1ns5").val();//Collect value from Filing Period Month form field
var Day = 20; //Due date for filing tax return
var DueDate = Month+'/'+Day+'/'+Year;
$("#field_tm25b").val(DueDate); //Populate "Due Date" form field with due date generated above

function parseMDY(s) {
var b = s.split(/\D/);
return new Date(b[2], b[0]-1, b[1]);

var Today = $("#field_1pjvu").val(); //Collect Value from Today's Date form field

if (DueDate > Today) {
$("#field_smmyr").val(1); //Returns true/1 for on or before due date
} else {
$("#field_smmyr").val(0); //Returns false/0 for after due date

Answer Source

You are making life more difficult than it needs to be. To parse a date string in m/d/y format, use a simple function like the one below.

If you want to compare dates using < or > as whole days, you can just compare them. But even though the relational comparison operators compare the dates as numbers, the == and === operators don't, so clearer to explicitly compare the time values.

function parseMDY(s) {
  var b = s.split(/\D/);
  return new Date(b[2], b[0]-1, b[1]);

var a = '2/29/2016';
var b = '12/31/2015';

document.write(parseMDY(a) + '<br>' + parseMDY(b) + '<br>');

document.write('Is ' + a + ' before ' + b + '? ' +
              (parseMDY(a).getTime() < parseMDY(b).getTime())

And if you want to compare to "today", don't forget to set the hours to zero:

var today = new Date();
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download