Datetime picker for share point project - sharepoint

Question

Does anyone have any example on how to put a date time picker inside a sharepoint project?
more specifically to put a date time picker in the gridview..
I've been googling for hours and still couldn't find example that works..
most of the example is for normal web project and not for sharepoint project..
and btw I've tried putting the datetimecontrol inside the gridview, but it doesn't work as well.
Thanks in advance.

Answer 1

I love to use jQuery UI's Datepicker:
http://jqueryui.com/demos/datepicker/
To implement in a GridView, I normally make an editable text box and just apply the class to it, which would invoke the datepicker:
<asp:GridView ID="gvClientDetails" runat="server">
<Columns>
<asp:TemplateField HeaderText="Date">
<EditItemTemplate>
<asp:TextBox runat="server" ID="myTextBox" CssClass="dateTextBox" />
</EditItemTemplate>
<ItemTemplate>
<asp:Label ID="myLabel" runat="server" Text='<%# Eval("myDate") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
and then make use of the below javascript (registered on your page or site wide):
$('.dateTextBox').each(function () {
$(this).datepicker(
{
changeMonth: true,
changeYear: true,
dateFormat: 'yy/mm/dd'
});
})
As for applying something like this to your sharepoint site, this should assist you:
http://blogs.lessthandot.com/index.php/WebDev/UIDevelopment/Javascript/adding-a-jquery-date-picker-to-sharepoint

Answer 2

Just use common standard SP DateTimeControl.
This is how we do it :
/// <summary>
/// Get common SP DateTimeControl with current DateOnly settings and MethodToProcessDateChanged
/// </summary>
public static DateTimeControl Cd(this bool DateOnly, bool AutoPostBack = false,
DateTime? SelectedDate = null, Func<bool> MethodToProcessDateChanged = null)
{
var d = new DateTimeControl();
d.DateOnly = DateOnly;
d.AutoPostBack = AutoPostBack;
if (SelectedDate != null)
d.SelectedDate = SelectedDate.Value;
if (MethodToProcessDateChanged != null)
d.DateChanged += (o, e) => { MethodToProcessDateChanged();};
return d;
}
See more details with some common usage samples here