CODEWITHSUNDEEP
javascriptjqueryajaxdate
BN83
BN83

Reputation: 902

Date in variable reading as "Invalid Date"

Using the following:

var timestart = $('.thisDiv').data("timestart");
var startDateTime = new Date(timestart);

to collect a date from a php file that is updating by ajax from this:

$TimeStart = date( 'Y,m,d,g,i', $TimeStart );

<div class="thisDiv" data-timestart="<?= $TimeStart ?>"></div>

var timestart = $('.thisDiv').data("timestart");

In console I'm getting the following when logging timestart and startDateTime:

2017,07,24,7,50
Invalid Date

If I paste the date that is output as follows

var startDateTime = new Date(2017,07,24,7,50);

Then it works fine. Any ideas why I'm getting Invalid Date?

Upvotes: 1

Views: 887

Answers (2)

Qirel
Qirel

Reputation: 26450

Your timestart variable (JavaScript) is just a string. So it's a string 2017,07,24,7,50, and not those elements in order - which can't be used as separate parameters like new Date() expects.

Let's take a look at it!

var startDateTime = new Date(2017,07,24,7,50);   // Parameters in order - all OK!
var startDateTime = new Date("2017,07,24,7,50"); // A single string - single parameter, not OK!

You need to return a proper format of dates from PHP with a format that's valid in JavaScript. Per the ECMAScript standard, the valid format that should work across all browsers is YYYY-MM-DDTHH:mm:ss.sssZ (see the reference at the bottom). To define that from PHP, you would need to format it as such

$TimeStart = date('c', $TimeStart);

This would return a format such as 2017-07-24T21:08:32+02:00.

Alternatively, you can use a splat/spread-operator ... and split the string it into elements, which I find as the better approach than above.

var timestart = $('.thisDiv').data("timestart");  // Get the string: "2017,07,24,7,50"
timestart = timestart.split(",");                 // Split into array
var startDateTime = new Date(...timestart);       // Pass as arguments with splat-operator

Upvotes: 2

marzelin
marzelin

Reputation: 11600

You need to convert your date from string format to numbers.

var timestart = $('.thisDiv').data("timestart").split(",").map(Number);
var startDateTime = new Date(...timestart);
console.log(startDateTime)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="thisDiv" data-timestart="2017,07,24,7,50"></div>

Upvotes: 0

Related Questions