JSOM and UTC conversion

Question

I'm using client Object Model to filter a list and display an event date.

When displayed I see a UTC date format. How can this be converted to UK date format using Javascript object model?

Is it possible using : Utility.FormatDateTime method?

Currently I'm displaying :

Wed Dec 10 00:00:00 UTC 2014 

I require

10 Decemeber 2014

I'm accessing list using :

oListItem.get_item("EventStart")

Answer 1

Out of the box I am not sure if there is any Date format methods are available. You can use something like

var m_names = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth();
var curr_year = d.getFullYear();
var formatted = curr_date + "/" + m_names[curr_month] + "/" + curr_year;

https://stackoverflow.com/questions/3552461/how-to-format-javascript-date

Answer 2

When you get the list item date value you can put it inside of a Date object, which will handle the UTC conversion for you; then you have some options on formatting:

Option 1:

The easiest from SharePoint is to use the Date.format() function provided from the ASP.NET Ajax Date Type Extensions:

var myDate = new Date(oListItem.get_item("EventStart"));
var myFormattedDate = myDate.format("dd MMMM yyyy");
console.log(myFormattedDate);

Logs something like the following to the console:

"08 December 2014"

That should give you what you're looking for... The .format() function is automatically available on Date objects when your browser is viewing a normal SharePoint page -- no need to reference or bring in any libraries. Just be aware when you want to use this on a handcrafted web page somewhere else on the web that it's not part of any base Javascript specifications/implementations.

Here is an MSDN article listing the valid format specifiers and a bunch of examples: http://msdn.microsoft.com/en-us/library/vstudio/8kb3ddd4%28v=vs.100%29.aspx

---

Option 2:

Use a library like moment.js to handle date formatting for you.

---

Option 3:

Hand craft the format using getDate(), getMonth(), etc. as Amal suggests.

---

Another (less desirable) option:

You could also use the Date object methods that are part of the ECMA Internationalization API standard to get what you're looking for:

var myDate = new Date(oListItem.get_item("EventStart"));
myDate.toLocaleString("en-GB", { day: "numeric", month: "long", year: "numeric" });

I really can't recommend this route though, because there are some major compatibility restrictions with the Intl.DateTimeObject format used above; namely that IE doesn't support it before version 11 and safari doesn't support it at all.

More info on compatibility can be found here: http://caniuse.com/#search=Internationalization