I know what you’re thinking, what date format problem? Well this is something that’s cropped up for me time and time again so let me explain. Most requests I get for new SharePoint lists will usually contain a variety of custom date columns and said list will also require that the default display form shows a unique view of this data.
On the default display form, you will notice that the custom date columns will be showing data that looks like this:
Well this just won’t do, will it? The good news is we can fix it!
To be able to customise the display form, you will need to be able to connect to your SharePoint environment using SharePoint Designer, if you don’t have it you can download it from Microsoft here:
SharePoint Designer 2010 (32 bit)
For this example, we are only focusing on one custom date column, at the end of the post I will summarise how to fix this issue for multiple custom date columns.
- Open SharePoint Designer and connect to your environment
- Navigate to the lists and libraries and open the list you want to change
- Within the Forms section – New Form
(I’d recommend creating a new display form for no other reason than to avoid potentially breaking the active one).
- Give the form a logical name so you can identify it at a glance as a display form (I usually go for DispForm2)
- Press OK
- The code behind the display form will open, don’t worry too much about this we are only interested in a small portion of the code.
- In the Ribbon – under the Home Tab – Press Advanced Mode
- If it’s not already, at the bottom of the form – change the view to split view
- Scroll through the design view of your form until you find the custom date field – select it
- In the code view, make sure the following line is highlighted:
<xsl:value-of select="@Start_x0020_Date"/>
(NOTE: the bits after the @ will be the name of your date field) - If you amend this line of code to look like this:
<xsl:value-of select="ddwrt:FormatDate(string(@Start_x0020_Date), 2057, 3)"/> - you should see something like this:
11 June 2014 - Save the display form
- Press Preview in browser to double check the format date function is working as expected
- Close preview browser, close the display form
- In the forms section of the list – select your form
- In the Ribbon – Set as Default
That’s all there is too it! It might seem like quite a few steps but it isn’t too bad once you get comfortable with the forms code view.
If you have more than one custom date column that you need to format, just amend the code of each custom date column using the example above as a guide (just make sure if you copy/paste the code that each @ name is different.
FormatDate function and locales explained
What our updated code is doing is inserting a FormatDate function, which allows us to add the locale parameters to the end of our line code (the 2057, 3). The locale parameters control what the output of the FormatDate function will be, here are some examples of the outputs and locale parameters:
| 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 |
If you are looking for a list of all the available locales you can find them here:
https://msdn.microsoft.com/en-us/library/ms912047(v=winembedded.10).aspx
That’s it for now, if you’ve got anything you’d like me to cover feel free to get in touch or leave a comment!
SharePoint Stuff 