jQuery mobile Datebox date range difference

Question

here are the codes and preview >> http://jsfiddle.net/shingou/PGFxZ/

as you can see I've used jquery mobile and jquery datebox plugin for this one. and I've got a code here to get the difference between those dates.

function parseDate(str) {
    var mdy = str.split('/')
    return new Date(mdy[2], mdy[0]-1, mdy[1]);
}

function daydiff(checkinDate, checkoutDate) {
    return (checkoutDate-checkinDate)/(1000*60*60*24)
}
$('#checkoutDate, #checkinDate').live('change', function() {
    $('#numNights').each(function() {
        $(this).text(daydiff(parseDate($('#checkinDate').val()), parseDate($('#checkoutDate').val())));
    });
});

obviously if we change the date format here.

jQuery.extend(jQuery.mobile.datebox.prototype.options, {
    'dateFormat': 'mm/dd/YYYY',
    'headerFormat': 'mm/dd/YYYY',
});

for example we make it like this:

jQuery.extend(jQuery.mobile.datebox.prototype.options, {
    'dateFormat': 'ddd, dd mmm YYYY',
    'headerFormat': 'ddd, dd mmm YYYY',
});

the difference between the range dates will result to NaN.

any solution on this is really helpful, thanks in advance.

Answer 1

Datebox has a .data('datebox').theDate function to get the date from the input so you wont have to parse it.

I have modified your fiddle accordingly http://jsfiddle.net/PGFxZ/3/