Custom Date Formats in SharePoint XSL
There are quite a few posts out there on this topic, but I’m yet to find one comprehensive post that walks through this beginning to end and actually works. Let’s give it a go.
A very common scenario for SharePoint publishing sites is to customize the look to suit the customers needs. Usually this is done with a Content Query Web Part and some custom XSL. When doing this very often you need to display a date. You will quickly notice that just displaying the date that SharePoint gives you is not going to be sufficient. If you just did the standard
<xsl:value-of select="@ArticleStartDate"/>
You get back a pretty nasty looking result
2009-03-23 00:00:00
However if you use the “FormatDate” function, you can make this look a lot better.
<xsl:value-of select="ddwrt:FormatDate(@ArticleStartDate, 2057, 3)"/>
Results in this
23 March 2009
All you need to do to make sure the “FormatDate” function is available in your custom XSL files is to make sure you reference the ddwrt namespace.
xmlns:ddwrt="https://schemas.microsoft.com/WebParts/v2/DataView/runtime
Once this has been added to the rest of your namespace declarations at the top of your <xsl:stylesheet> tag, you should be able to use the “FormatDate” function anywhere you like. Here is sample of what a full XSL file would look like that does this.
<xsl:stylesheet
version="1.0"
exclude-result-prefixes="x d xsl msxsl cmswrt"
xmlns:x="https://www.w3.org/2001/XMLSchema"
xmlns:d="https://schemas.microsoft.com/sharepoint/dsp"
xmlns:cmswrt="https://schemas.microsoft.com/WebParts/v3/Publishing/runtime"
xmlns:xsl="https://www.w3.org/1999/XSL/Transform" xmlns:msxsl="urn:schemas-microsoft-com:xslt"
xmlns:ddwrt="https://schemas.microsoft.com/WebParts/v2/DataView/runtime">
<xsl:template name="Default" match="*" mode="itemstyle">
<xsl:value-of select="ddwrt:FormatDate(@ArticleStartDate, 2057, 3)"/>
</xsl:template>
</xsl:stylesheet>
Here are the details on the different formats you can get by changing the parameters. March 23 12:00 AM was used as input for all outputs.
Output | Locale | Format |
3/23/2009 | 1033 | 1 |
3/23/2009 12:00 AM | 1033 | 2 |
Monday, March 23 2009 | 1033 | 3 |
12:00 AM | 1033 | 4 |
Monday, March 23, 2009 12:00 AM | 1033 | 7 |
3/23/2009 12:00:00 AM | 1033 | 13 |
Monday, March 23, 2009 12:00:00 AM | 1033 | 15 |
23/03/2009 | 2057 | 1 |
3/23/2009 12:00 AM | 2057 | 2 |
23 March 2009 | 2057 | 3 |
00:00 | 2057 | 4 |
23/03/2009 00:00 | 2057 | 5 |
23 March 2009 00:00 | 2057 | 7 |
00:00:00 | 2057 | 12 |
23/03/2009 00:00:00 | 2057 | 13 |
23 March 2009 00:00:00 | 2057 | 15 |
You can also get a list of all the available locale’s here.
Comments
Anonymous
March 25, 2009
PingBack from http://blog.a-foton.ru/index.php/2009/03/25/custom-date-formats-in-sharepoint-xsl/Anonymous
November 15, 2009
Hi, how can I add a lookup field? Thanks a LotAnonymous
July 21, 2011
Thanks for the super-useful reference! I used a snippet of this in a write up on how to style up a Content Query Web part with some styling. A useful writeup showing an implementation of the code above <a href="labs.steveottenad.com/.../">Sharepoint 2010 XSLT Date Formatting in a CQWP</a>. Thanks again!Anonymous
January 30, 2012
I believe it should be as follows: <xsl:value-of select="ddwrt:FormatDate(string(@ArticleStartDate, 2057, 3)" /> The addition is "string"Anonymous
May 19, 2012
Superb Article. Please keep posting such articles it will help a lot of developers !Anonymous
May 23, 2012
Thanks for this article. Also thanks for Michael Rudder. The addition of "string" worked for me, otherwise it gives error.Anonymous
June 06, 2012
Hi plese can u say the format for Monday 27th Febraury 2012 ?Anonymous
June 07, 2012
thnx a lot ! One question,I have to find the difference between my date and the current date, how can i do that?Anonymous
September 05, 2012
Very useful! Two comments:
- In SharePoint Designer the ddwrt namespace is already added (at least it is in my custom display form)
- The correct syntax does use string, but needs an extra ")" e.g. <xsl:value-of select="ddwrt:FormatDate(string(@EventDate), 1033, 7) "/>
Anonymous
December 31, 2012
hi , just i hope to understand xslt without i study anything how i can do that ?Anonymous
March 11, 2013
Loved this! Thank you very much. Now write one on how to parse recurring event data into a nice format too! :)Anonymous
September 12, 2013
this is still a lifesaver ( 4 years after original post !) ...many many thanks ! It worked for me without the string bit that people have mentioned in the comments...Anonymous
November 02, 2013
Hi, First of all thanks for this beautiful post, My requirement is to display From calendar to CQWP in 12:00PM format I m struggle from last 2 days but not able to do it. Do you have any idea to display time in 12:00 PM format as you have shown code for 12:00 AM ThanksAnonymous
November 04, 2013
I'm finding I'm having to do something like this in order to display the data in a US format but also offset the time. My question is, will I need to change this to a different locale code when the US goes back into Daylight Savings Time. Will I need to have to adjust my code twice a year? <xsl:value-of select="ddwrt:FormatDate(string(@ArticleStartDate) ,1033 ,1)"/><xsl:text> </xsl:text><xsl:value-of disable-output-escaping="no" select="ddwrt:FormatDateTime(string(@ArticleStartDate), 2057, 'HH:mm tt')" />Anonymous
November 04, 2013
Thanks Jeff How can I use this date filed as a variable. When I try to form it as below , It does not reflect any change <xsl:variable name="endtime" select="ddwrt:FormatDate(string(@enddatetime) ,1033 ,1) /> <xsl:value-of disable-output-escaping="no" select="ddwrt:FormatDateTime(string(@endtime), 2057, 'HH:mm tt')" /> <span class="time">Time: <xsl:value-of select="$endtime" /></span> Do you have any idea to format it in form of Time. Thanks a lot.Anonymous
March 12, 2014
Is there a format for adding full, e.g. 01/20/2014?Anonymous
May 04, 2014
@Kevin This will work <xsl:value-of select="ddwrt:FormatDate(string(@YourDateColumn),1033,1)"/>Anonymous
June 25, 2014
<xsl:value-of select="ddwrt:FormatDate(string(@FollowupDate),1033,1)"/> is returning 1/29/1900 is date is null or empty. How to test if date is empty or null? Appreciate your help. Thanks & Regards, KhushiAnonymous
July 28, 2014
Thanks for this. I was able to get the formatting I wanted but the time was off as it was using/showing UTC time. I ended up using "1033, 5" to adjust to local time. Oddly that combo wasn't listed above which threw me for a bit.Anonymous
October 17, 2014
Great article for date format values.Anonymous
December 24, 2014
Nice Article, You can find user friendly date time format programmatically sharepointsolutions-sudheer.blogspot.com/2014/12/user-friendly-time-in-sharepoint.htmlAnonymous
February 12, 2015
blogs.msdn.com/.../custom-date-formats-in-sharepoint-xsl.aspxAnonymous
October 14, 2015
<xsl:value-of select="ddwrt:FormatDateTime(string(ddwrt:Today()) ,1033,'dd-MM')" /> return Server time and date in PST time zone in Office 365. How to get local time in CQWP in GMT time zone?