Friday, December 4, 2009

The On Demand Global Workforce - oDesk


A very common desire is to set a column of a gridview to display just the month, day and year of a DateTime type. The problem is the by default, the HtmlEncode property of the boundfield attribute ( as pointed out in the documentation of this attribute) is that this helps prevent cross-site scripting attacks and malicious content from being displayed. Microsoft recommends that the HtmlEncode attribute be enabled whenever possible.
The problem is that if this field is enabled, you can not pass format information to the boundfield control. That is, if you try the following code, you will not get the desired result.


asp :GridView ID="GridView1" runat="server">
columns>
  asp :BoundField DataField="CreationDate"
     DataFormatString="{0:M-dd-yyyy}"
     HeaderText="CreationDate"   />
/columns>
/asp>

You have two choices to make this work as you would expect. The first choice is to simply set HtmlEncode to false as follows:


asp :GridView ID="GridView1" runat="server">
columns>
  asp :BoundField DataField="CreationDate"
     DataFormatString="{0:M-dd-yyyy}"
     HtmlEncode="false"
     HeaderText="CreationDate"    />
/columns>
/asp>
 
 The second choice is to make the column a template and simply set the
format string directly in the Label or Text Fields as follows.
 
asp :GridView ID="GridView3" runat="server"  >
 columns>
 asp :TemplateField HeaderText="CreationDate" >
   edititemtemplate>
    asp :Label ID="Label1" runat="server"
      Text='%# Eval("CreationDate", "{0:M-dd-yyyy}") %>'>
    /asp>
   /edititemtemplate>
   itemtemplate>
    asp :Label ID="Label1" runat="server"
      Text='%# Bind("CreationDate", "{0:M-dd-yyyy}") %>'>
    /asp>
   /itemtemplate>
  /asp>
 /columns>
/asp> 


To make the DOB column to display a short date format without the time, we need to include DataFormatString = "{0:d}"  for the BoundColumn to display a short date.



asp:BoundField DataField="DOB" HeaderText="Date Of Birth" DataFormatString = "{0:d}"   ReadOnly="True" />

Making the above setting only will not work. It is because, by default, HTML encode is turned “on” to prevent executing some dangerous script when injected through cross site scripting attacks. Because of this default setting, the text in the column will be encoded so that the cross site scripting is not executed. In order to make the above setting work, we need to make the HtmlEncode property of BoundColumn to false.

asp:BoundField DataField="DOB" HeaderText="Date Of Birth" HtmlEncode="False" DataFormatString = "{0:d}"   ReadOnly="True" />


For Long Date,
asp:BoundField DataField="DOB" HtmlEncode="False" DataFormatString = "{0:D}" HeaderText="Date Of Birth[Long Date]" ReadOnly="True" /> 

For Long Time,
asp:BoundField DataField="DOB" HtmlEncode="False" DataFormatString = "{0:T}" HeaderText="Date Of Birth[Long Time]" ReadOnly="True" />

Using Eval in the place of Bind will also work. You use the Eval method when the control will only display values. You use the Bind method when users can modify a data value—that is, for data-update scenarios. 

These binding methods can take the formatting string as the next argument to set the format of the date displayed.

ItemTemplate>
                        asp:Label ID="lblDOB" runat="server" Text='<%# Eval("DOB","{0:d}") %>'>
                        /ItemTemplate>
                        /asp:TemplateField>   

For Long Date,
                        asp:TemplateField HeaderText="Date Of Birth[Long Date]">
                        ItemTemplate>
                        asp:Label ID="lblDOB" runat="server" Text='%# Bind("DOB","{0:D}") %>'>/asp:Label>
                        /ItemTemplate>
                         /asp:TemplateField>

For Long Time,
                       asp:TemplateField HeaderText="Date Of Birth[Long Time]">
                        ItemTemplate>
                        asp:Label ID="lblDOB" runat="server" Text='%# Bind("DOB","{0:T}") %>'>/asp:Label>
                        /ItemTemplate>
                        /asp:TemplateField>

The following table shows some date format strings that can be used to format date in GridView columns,
Format Pattern
Name
Example
d
Short date
11/8/2008
D
Long date
Sunday, August 11, 2008
t
Short time
3:32 PM
T
Long time
3:32:00 PM
f
Full date/time
(short time)
Sunday, August 11, 2008 3:32 PM
F
Full date/time
(long time)
Sunday, August 11, 2008 3:32:00 PM
g
General date/time
(short time)
8/11/2008 3:32 PM
G
General date/time
(long time)
8/11/2008 3:32:00 PM
m or M
Month day
August 11
r or R
RFC 1123
Sun, 11 Aug 2008 8:32:00 GMT
s
Sortable date/time
2008-08-11T15:32:00
u
Universable sortable date/time
2008-08-11 15:32:00z
U
Universable sortable date/time
Sunday, August 11, 2008 11:32:00 PM
y or Y
Year month
August, 2008