Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles
(untagged)

Complete Date/Time Picker Control

0.00/5 (No votes)
8 Aug 2013 1  
A complete replacement to Microsoft's Date/Time Picker control.

Introduction 

I'm currently working on a home finance application and needed a date control.  The one provided by Microsoft is OK but very limited.  Its problems are: 

  • No easy way for a user to enter a null date.
  • No way to select the whole date to either re-type in the date or null it out.  This was especially a problem when I embedded Microsoft's date control inside a DataGridView control with the edit mode set to EditOnEnter.  I wanted it set so if everything was selected on the control, then the arrow keys would move to the next or previous cell.  Otherwise the cursor would move in that cell.
  • While editing the date, the cursor doesn't move automatically to the next date segment.  The user has to type in the date separator character or the arrow keys to move to the next date segment. This makes data entry cumbersome and slow.   

I did some looking around in CodeProject and other web sites and couldn't find what I needed.  So, I decided to write this date control.  Its features are: 

  • Displays a date and/or time in any valid Microsoft date format.
  • When entering dates, the cursor automatically skips over date separator characters like '-' and '/' which makes for smooth and fast data entry for the user. 
  • The control validates on entry to make sure the user doesn't enter invalid date sections (ex. entering a month value over 12).
  • The drop down button, when clicked, shows the standard calendar control and supports Min/Max Date properties. 
  • When the user enters a date/time value, an entry pattern is shown (ex. 00/00/0000) so the user knows which date segment he/she is currently editing. 
  • Nulling-out the control is easy.  Simply select everything in the control and hit Back Space or Delete and everything reverts back to the date/time entry pattern.  Tab out from there and the control will show blank.     

There are a couple limitations:   

  • When entering a date and time, the user has to enter all digits for the date/time segment.  For example, if you set the DateFormat property to be "M/d/yy",  when the user tries to enter a date, he/she will need to enter "03/03/2013" (excluding the slashes) instead of "3/3/13 ". This is necessary so the user doesn't have to enter the slashes and so that entry validation knows where the user is and can validate accordingly.  However, once you leave the control, it will show (per the example) "3/3/13".  Even though the user has to enter a few more digits, it's faster than entering slashes or dashes. 
  • Any valid DateFormat & TimeFormat property values are allowed as long as today's date can be formatted with the Date/Time Format property values and then immediately converted back to a DateTime variable. If the validation fails anywhere in the 2 above procedures, then a messagebox will show.  

Using the code 

Using the code is quite simple.  Just drop in the CompleteDateTimePicker.dll into the toolbox or add the project to your solution.  Then drag a CompleteDateTimePickerControl onto your form and that's it.

There are 2 controls in this control:  A TextBox and a Button. 

The control will start with a MM/dd/yyyy DateFormat property value.  The TimeFormat will be blank.  You'll notice that the entry pattern will show "00/00/0000".  This entry pattern will only show in design mode or if the control gets focus.  This is to aid in sizing the control.  If you change the DateFormat or TimeFormat property values, the entry pattern will also update.  

Use the Text property to get and set the text in the TextBox part of the control.  If the text in the TextBox control is just the date/time entry pattern, then the Text property will return blank.  In setting the property, the class will format the value and set the text.  If the value cannot be converted to a date, then the computer will beep. 

Use the Value property to convert the current text into a DateTime variable and return.  If the text in the control is not a valid date/time, then the computer will beep.  To avoid this, check the ValidDate property value first which returns IsDateValidResult.Valid if the text in the control is a valid date.  Setting the property is the best way to set the control's value.  

The FormattedText property returns whatever is in the TextBox control as is.

The following properties affect the TextBox control:  

  • ForeColor   
  • BackColor  
  • Font 
  • ContextMenuStrip
  • SelectionStart 
  • SelectionLength   

There's 1 event:  ValueChanged (virtual OnValueChanged) which is fired when the date in the TextBox control changes.

Points of Interest

Overall, I have learned a lot while making this control and I look forward to people's comments and critiques about it.

History

  • 07/31/2013 - Initial release.

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