convert 'esriFieldTypeDate' to human readable (with JS)

925
9
Jump to solution
07-13-2020 07:20 AM
CamCode
New Contributor III
dlv.innerHTML = `<b><span class='name_plc'></span></b><br>ID: <span class="ida">${feature.graphic.attributes.id}</span><br> URL: <a href="${feature.graphic.attributes.url}" target="_blank">View</a> <br> Updated: <span class='tiCon1'>${feature.graphic.attributes.updated}</span><br>Grid_value: ${feature.graphic.attributes.grid_value}<br> Event Time: <span class='tiCon2'>${feature.graphic.attributes.eventTime}</span> <style>.esri-popup__navigation { display: none;}</style>`;

let date1= $('.tiCon1').text();
let dt = new Date(date1).toUTCString();
console.log(dt);

I try the above to convert it, for instance and it consoles as invalid date...

In the above, my event time and updated queries resolve as the numbers below.. I want to convert these to a human readable format.

Updated: 1593543128000 <---------------------

Event Time: 1593021559000 <----------------------------

Tags (1)
0 Kudos
1 Solution

Accepted Solutions
KenBuja
MVP Honored Contributor

In your Codepen, this works:

dlv.innerHTML = `<span class='name_plc'></span></b><br>ID: <span class="ida">${feature.graphic.attributes.id}</span><br> URL: <a href="${feature.graphic.attributes.url}" target="_blank">View</a> <br> Updated: ${new Date(JSON.parse(feature.graphic.attributes.updated)).toUTCString()} <br>Grid_value: ${feature.graphic.attributes.grid_value}<br> Event Time: ${new Date(JSON.parse(feature.graphic.attributes.eventTime)).toUTCString()} <style>.esri-popup__navigation { display: none;}</style>`;

View solution in original post

9 Replies
Egge-JanPollé1
MVP Regular Contributor

Hi Cam Code‌,

When I try the two values given, it works out fine for me. See below. (Date.prototype.toUTCString() - JavaScript | MDN )

What exactly is the content of your variable date1?

HTH,

Egge-Jan

const event = new Date(1593543128000).toUTCString();

console.log(event);
// expected output: Tue, 30 Jun 2020 18:52:08 GMT

const event = new Date(1593021559000).toUTCString();

console.log(event);
// expected output: Wed, 24 Jun 2020 17:59:19 GMT
CamCode
New Contributor III

I guess it is consoling as a date object

0 Kudos
CamCode
New Contributor III

For me it consistently consoles as invalid date for some reason, even if I get the raw text to console (non object).

0 Kudos
KenBuja
MVP Honored Contributor

If you take the Codepen from your previous question, adding this at line 168 gives your the time of each feature in the console.

console.log(new Date(feature.attributes.eventTime).toUTCString());

CamCode
New Contributor III

Thanks Ken, is this a handle I could use to output the correct date formats in my popup template?

0 Kudos
CamCode
New Contributor III

Tried this within the popup template function for instance, with no avail:

let cxx = '{updated}';
console.log(cxx);
let dTx = new Date(cxx).toUTCString();
$('.tiCon2').text(dTx);

0 Kudos
KenBuja
MVP Honored Contributor

In your Codepen, this works:

dlv.innerHTML = `<span class='name_plc'></span></b><br>ID: <span class="ida">${feature.graphic.attributes.id}</span><br> URL: <a href="${feature.graphic.attributes.url}" target="_blank">View</a> <br> Updated: ${new Date(JSON.parse(feature.graphic.attributes.updated)).toUTCString()} <br>Grid_value: ${feature.graphic.attributes.grid_value}<br> Event Time: ${new Date(JSON.parse(feature.graphic.attributes.eventTime)).toUTCString()} <style>.esri-popup__navigation { display: none;}</style>`;
CamCode
New Contributor III

Solved after linting it with JSON.parse for some reason. i.e. Below worked in my case:

let dCn = $('.tiCon1').text();
let dl = JSON.parse(dCn); <-------------------------------- required this

const dTT = new Date(dl).toUTCString();
console.log(dTT);

0 Kudos
CamCode
New Contributor III

Welp, actually doesn't look like I can use this -- worked fine in a CodePen, pushed to a server I'm getting a JSON parse error. Back to the drawing board.

Uncaught SyntaxError: Unexpected token M in JSON at position 0

0 Kudos