topic Re: convert 'esriFieldTypeDate' to human readable (with JS) in ArcGIS JavaScript Maps SDK Questions

convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Sat, 11 Dec 2021 15:58:45 GMT

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 <----------------------------

Re: convert 'esriFieldTypeDate' to human readable (with JS)

Egge-Jan_Pollé — Sat, 11 Dec 2021 15:58:48 GMT

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
‍‍‍‍‍‍‍‍‍

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 15:16:01 GMT

I guess it is consoling as a date object

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 15:20:39 GMT

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

Re: convert 'esriFieldTypeDate' to human readable (with JS)

KenBuja — Mon, 13 Jul 2020 15:41:11 GMT

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());‍‍

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 15:43:09 GMT

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);

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 16:28:18 GMT

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

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 17:03:25 GMT

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

Re: convert 'esriFieldTypeDate' to human readable (with JS)

CamCode — Mon, 13 Jul 2020 17:25:45 GMT

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);

Re: convert 'esriFieldTypeDate' to human readable (with JS)

KenBuja — Mon, 13 Jul 2020 18:44:50 GMT

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>`;‍