Click here to Skip to main content
11,502,800 members (64,105 online)
Click here to Skip to main content

Web DatePicker Control

, 29 Mar 2004 429.3K 3.7K 77
Rate this:
Please Sign up or sign in to vote.
Article on how I built my Date Picker Control.

Updates

Thanks to Camilo Orozco for providing me with the translated uncompiled C# code. The .cs file had been added to the source code zip. Sorry it's taken so long to post.

Introduction

One of the most common causes of application failure, especially for new developers, is handling date input from the user. If it's in the wrong format and you try to write it to the database, then the database command fails. If the user switches the day and month then your date could be wrong, even if you're using a regular expression validator (i.e. 01/02/2004 could be 2 January 2004 or 1 February 2004).

To get around this, I used to wire a server side calendar control to the textbox onClick event, and launch it in a new window, forcing the user to select a date, then return the date in the format of my choice to the textbox. But while this is all well and good for simple web apps, this week I needed the same functionality to be launched from inside a server component I was writing.

Background

I remember that in the old days of ASP, there was a lengthy JavaScript solution we used to use, that would be perfect for what I was trying to do now. I asked a few people, and a lot of guys sent me the same code back. Full credit must go to Tan Ling Wee for writing the original JavaScript code, even though I've never met him (or her - not quite sure), and to all the people who passed it on until it eventually arrived in my email box. Now here was a piece of code perfect for what I needed to do, but it's over 600 lines long, and there's no way in hell I was going to manually reformat it line by line so that I could render it to the client. So, as any really lazy developer does things, I wrote my own app to process the JavaScript and return a code block that I could simply copy and paste into Visual Studio (will write another article on this, and upload the app for use by all). After that, it was simply a matter of writing a new class that inherited from the control, added properties to make the control customizable, and compiled.

Using the code

If you're using Visual Studio, you can simply add the control to the Toolbox, and then drag and drop it into your apps. For everyone else, first copy the DLL to the bin directory of your project. Then, on your aspx page, you'll first need to register the component as follows:

<%@ Register TagPrefix="cc1" 
Namespace="DatePicker.iX.Controls"
    Assembly="DatePicker" %>

Then place the control on the page like so:

<cc1:DatePicker id="DatePicker1" runat="server"
  imgDirectory="/WebApplication6/img/" DateType="dd mmm yyyy">
</cc1:DatePicker>

You'll notice the properties imgDirectory and DateType. imgDirectory is the path to the directory where the control images needed can be found (images included in the download files). DateType is the format in which the date should be returned. "dd mmm yyyy" writes out the full date, e.g. "01 January 2003", but this can be changed to any format by changing this property (e.g. "dd/mm/yyyy" or "mm/dd/yyyy"). There is also a CssClass property, which sets the CssClass for the textbox, and a Text property, to set the start text to be displayed in the textbox.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Doug Wilson
Web Developer
South Africa South Africa
Doug is an Applications Integrator for an online gaming company. He has been programming for 9 years, and has been working with the .NET framework since the beginning of 2003, in both VB.NET & C#.

Comments and Discussions

 
GeneralMy vote of 1 Pin
Aubri22-Feb-11 6:59
memberAubri22-Feb-11 6:59 
Does not work; it hijacks the page's OnLoad, uses a bunch of hardcoded CSS and JS, and, oh yeah, doesn't actually return the value it records! Completely useless.
GeneralIt does not work at all Pin
rizwanaarif1-Feb-11 2:41
memberrizwanaarif1-Feb-11 2:41 
GeneralLooked good - but.... Pin
Dunkol21-Sep-10 10:40
memberDunkol21-Sep-10 10:40 
Generaldoes not work in firefox,chrome Pin
THINK12331-May-10 23:41
memberTHINK12331-May-10 23:41 
GeneralNot able to get the value in the control,plz help [modified] Pin
vickyboina23-Apr-10 1:46
membervickyboina23-Apr-10 1:46 
Questioncan you create one that supports Hijri calendars? Pin
rashadkk1-Apr-10 0:01
memberrashadkk1-Apr-10 0:01 
QuestionHow to get the date from the date picker control Pin
ravi_27may15-Feb-10 21:42
memberravi_27may15-Feb-10 21:42 
AnswerRe: How to get the date from the date picker control Pin
Hendrik Debedts12-Apr-10 0:35
memberHendrik Debedts12-Apr-10 0:35 
Generalyour datepicker doesn't work with ajax Pin
sameer_s26-Aug-09 2:22
membersameer_s26-Aug-09 2:22 
QuestionHow to use calendar img beside the text control and populate the date on click of img ? Pin
Member 208195111-Jul-09 6:38
memberMember 208195111-Jul-09 6:38 
QuestionDefault date is set every time Pin
naughtygirl_sony8-Feb-09 22:02
membernaughtygirl_sony8-Feb-09 22:02 
Questioncan't work inside an ajax updatepanel inside a master page Pin
mausepul22-Jan-09 9:54
membermausepul22-Jan-09 9:54 
GeneralMy vote of 1 Pin
wchvic16-Dec-08 17:37
memberwchvic16-Dec-08 17:37 
QuestionHow to get its value in .cs Pin
Tripathi Swati9-Sep-08 23:38
memberTripathi Swati9-Sep-08 23:38 
AnswerRe: How to get its value in .cs Pin
p05esto19-May-09 7:53
memberp05esto19-May-09 7:53 
QuestionAnyone get the calendar working in IE7? Pin
pliant616-Jul-08 3:31
memberpliant616-Jul-08 3:31 
AnswerFailure to Cast, and getting the selected date Pin
Joe Petitti19-Jun-08 6:49
memberJoe Petitti19-Jun-08 6:49 
GeneralRe: Failure to Cast, and getting the selected date Pin
monica00522-Sep-08 0:47
membermonica00522-Sep-08 0:47 
GeneralGetting the value from the control Pin
CodingJeff17-Jun-08 10:00
memberCodingJeff17-Jun-08 10:00 
GeneralCustomer Control Overwrite Pin
Member 420460516-Jun-08 22:08
memberMember 420460516-Jun-08 22:08 
GeneralFirst time user!! Pin
coolmesh844-Jun-08 0:18
membercoolmesh844-Jun-08 0:18 
GeneralUnable to cast object of type ... Pin
NickNnator20-Feb-08 7:48
memberNickNnator20-Feb-08 7:48 
GeneralRe: Unable to cast object of type ... Pin
mariops15-May-08 15:39
membermariops15-May-08 15:39 
GeneralRe: Unable to cast object of type ... Pin
wchvic16-Dec-08 15:29
memberwchvic16-Dec-08 15:29 
Questionhow will i assign values to the control ? Pin
varatha18-Feb-08 12:09
membervaratha18-Feb-08 12:09 
AnswerRe: how will i assign values to the control ? Pin
cheebeng2-Mar-08 16:16
membercheebeng2-Mar-08 16:16 
GeneralRe: how will i assign values to the control ? Pin
clov1-Jul-08 8:25
memberclov1-Jul-08 8:25 
QuestionCant get a handle on Text property Pin
gmri.net20-Jul-07 10:50
membergmri.net20-Jul-07 10:50 
AnswerRe: Cant get a handle on Text property Pin
CodingJeff17-Jun-08 10:20
memberCodingJeff17-Jun-08 10:20 
Generalusing DatePicker control in DataGrid Pin
Kiran Shaikh22-Jun-07 7:06
memberKiran Shaikh22-Jun-07 7:06 
GeneralRe: using DatePicker control in DataGrid Pin
talf00820-Aug-07 9:32
membertalf00820-Aug-07 9:32 
GeneralRe: using DatePicker control in DataGrid Pin
stixoffire21-May-08 22:27
memberstixoffire21-May-08 22:27 
GeneralStill having issue with PostBack Pin
dowens318-Jun-07 4:21
memberdowens318-Jun-07 4:21 
QuestionRe: Still having issue with PostBack Pin
K.Senthil Kumar18-Nov-07 20:20
memberK.Senthil Kumar18-Nov-07 20:20 
AnswerRe: Still having issue with PostBack Pin
adhakhwa25-Aug-10 6:28
memberadhakhwa25-Aug-10 6:28 
Generaltrigger event Pin
LadyReader30-May-07 5:46
memberLadyReader30-May-07 5:46 
GeneralRequiredFieldValidator Pin
ernest_elias13-Apr-07 3:45
memberernest_elias13-Apr-07 3:45 
GeneralRe: RequiredFieldValidator Pin
stixoffire21-May-08 22:53
memberstixoffire21-May-08 22:53 
Questionhow to make a link between textbox and monthcalendar in vb.net Pin
Sai Sankar26-Mar-07 21:08
memberSai Sankar26-Mar-07 21:08 
Questionerror while using the DLL Can any one help me in this regard Pin
hareendra5-Mar-07 22:08
memberhareendra5-Mar-07 22:08 
AnswerRe: error while using the DLL Can any one help me in this regard Pin
Matt Saltz27-Mar-07 10:12
memberMatt Saltz27-Mar-07 10:12 
GeneralRe: error while using the DLL Can any one help me in this regard Pin
ctaeger28-Mar-07 5:05
memberctaeger28-Mar-07 5:05 
GeneralRe: error while using the DLL Can any one help me in this regard Pin
Matt Saltz28-Mar-07 7:49
memberMatt Saltz28-Mar-07 7:49 
GeneralRe: error while using the DLL Can any one help me in this regard Pin
ctaeger28-Mar-07 9:22
memberctaeger28-Mar-07 9:22 
GeneralRe: error while using the DLL Can any one help me in this regard Pin
NiN9E1-Aug-07 23:01
memberNiN9E1-Aug-07 23:01 
GeneralGood Job Pin
Inggo28-Feb-07 18:57
memberInggo28-Feb-07 18:57 
GeneralRe: Good Job Pin
Matt Saltz27-Mar-07 11:11
memberMatt Saltz27-Mar-07 11:11 
GeneralFinally i could solve the problem of casting problem and it works fine Pin
real_harami25-Feb-07 6:51
memberreal_harami25-Feb-07 6:51 
GeneralRe: Finally i could solve the problem of casting problem and it works fine Pin
real_harami27-Feb-07 0:13
memberreal_harami27-Feb-07 0:13 
GeneralRe: Finally i could solve the problem of casting problem and it works fine Pin
lukevin23-Apr-08 2:11
memberlukevin23-Apr-08 2:11 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web03 | 2.8.150520.1 | Last Updated 30 Mar 2004
Article Copyright 2004 by Doug Wilson
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid