Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery datepicker returns NAN as timestamp

I am using jquery datepicker to select a date and convert to timestamp (epoch time). The script works arbitrarily. It shows timestamp for dates from 1st to 12th of any chosen month but makes time 12:00am of those days (I converted it online). But from 13th to the end of the month it shows NAN as timestamp. Strange enough when the date formated to dd/mm/yy all the days shows correctly.

$(function() {
    $("#datepicker").datepicker({dateFormat: 'dd-mm-yy',
        onSelect: function(dateText, inst) {
              var dtV = $(this).val();
              var d = new Date(dtV);
              var s = parseInt((d)/1000);
              $("#selectedDate").text("on " + dateText + "");
              $(".selectedDate2").text(s.valueOf());
        }
    });
});
like image 385
sunny_side_of_life Avatar asked Feb 25 '14 13:02

sunny_side_of_life


3 Answers

I had a similar problem: usually the datepicker worked properly, also for dates with the day after the 12th; but from time to time I saw in Google Analytics that a user was getting NaN-NaN-NaN.

After investigating, I discovered that it could be due to Google Translate.

I checked in my analytics the language of the users getting the error. Almost all of them had a language that my website did not support. That was enough to assume that Google Translator was causing the error.

To solve it, as explained here, add the notranslate class:

$(function() {
    $(".datepicker").datepicker();
    $('.ui-datepicker').addClass('notranslate');
});
like image 103
J0ANMM Avatar answered Oct 16 '22 10:10

J0ANMM


When you call new Date()you have to pass a valid date. dd-mm-yy is not a valid date for Dateand it's chenging your month per day.

If you cannot change your date format, try this:

onSelect: function(dateText, inst) {
    var dtV = $(this).val();
    var exploded=dtV.split("-");
    var d = new Date(exploded[2],exploded[1],exploded[0]);

EDIT: Better and shorter, use datepicker's getDate to get a Date object:

onSelect: function(dateText, inst) {
    var d = $(this).datepicker("getDate");

http://jsfiddle.net/9WMvk/

like image 2
ojovirtual Avatar answered Oct 16 '22 09:10

ojovirtual


Following works for me. Just added a ui-datepicker class:

$(function () {
        $("#txtStartDate").datepicker();
        $('.ui-datepicker').addClass('notranslate');
    });
like image 1
Muhammad Awais Avatar answered Oct 16 '22 08:10

Muhammad Awais