Stuff. And nonsense.

Date/Time Picker ASP.NET Web Control

This is a sub-classed System.Web.UI.WebControls.TextBox which adds a customisable date/time picker widget.

There are craploads of date pickers available, but this has a few features that you may or may not find useful:

  • The ability to select times as well as dates (or even time-only, if you're that way inclined)
  • Culture-aware date formats & localised UI strings (via the System.Globalization namespace)

Have a play with the control here, or download below.

Download: DateTimePicker.1034 version Revision 1034, 23 May 2009
Compressed (zipped) file, 38.0 KB

Usage

First, tell your application where to find the control (& the associated formatting handler), via your Web.config file:

<system.web>
    <httpHandlers>
        <add verb="GET" path="/JavascriptDateTimeFormat.axd" type="Mark.Web.UI.JavascriptDateTimeFormat, Mark.Web.UI.WebControls.DateTimePicker"/>
    </httpHandlers>
    <pages>
        <controls>
            <add tagPrefix="mark" assembly="Mark.Web.UI.WebControls.DateTimePicker" namespace="Mark.Web.UI.WebControls"/>
        </controls>
    </pages>
</system.web>

Now, add the control to your form:

<form runat="server">
    
    <p>
        Picker with no configuration applied.<br />
        <mark:DateTimePicker ID="Picker1" runat="server" PickerCssClass="Picker" />
    </p>

    <p>
        Picker with image buttons active and Clear button enabled.<br />
        <mark:DateTimePicker ID="Picker2" runat="server" ShowClearButton="true" UseImageButtons="true" PickerCssClass="Picker" />
    </p>

    <p>
        Date/Time picker.<br />
        <mark:DateTimePicker ID="Picker3" runat="server" ShowClearButton="true" UseImageButtons="true" PickerCssClass="Picker" ShowTimePicker="true" Width="250" />
    </p>
        
    <p>
        Picker with some styling.<br />
        <mark:DateTimePicker ID="Picker4" runat="server" ShowClearButton="true" UseImageButtons="true" PickerCssClass="PickerStyled" />
    </p>
        
</form>

Documentation

I'm not going to document the control here - the download package includes a documentation XML file with comments for the control's various config properties - your IDE of choice should be able to tell you about the library as you use it.

I've tried to add as many CSS hooks via classes as possible - using these & the "cascade" of CSS, you should be able to customise the appearance to your satisfaction on a control-by-control basis.

One thing to be careful of - only one Culture can be set per page - i.e. when using multiple pickers on a page, they will all have the same Culture applied (either the first picker's Culture, or the last - I can't remember...). This usually isn't a problem...

Latest Releases