DateTimePickerTemplated Control
Life With Nate
Nate's Poetry Page
Resume (PDF)
Nate's Code
ASP.NET 2.0/3.5
ButtonExtensions
ConditionalRequiredTextValidator
CSSImageMap
CustomStyle
DateTimePicker
DateTimePickerTemplated
LengthValidator
RestrictInputTextBox
RestrictInputValidator
Rollovers
RotatedTextHandler
RotatedTextImage
Rotators
SelectedCountValidator
SlideIntoView
StatesDropDownList
UniqueValueValidatorBase
VB.NET 2.0/3.5
Just For Fun
Windows Phone 7
Description
The DateTimePickerTemplated control is a templated version of the
DateTimePicker
control and is used to select a date and/or time using either a custom or predefined template. When a date is being selected, AJAX is used to automatically update the DropDownList for the day component to have the correct number of days for the month and year displayed and, if included in the selected day format, updates the day of the week. The date and/or time can be displayed in either order on one or two lines.
Example
Below are the available predefined templates for the DateTimePickerTemplated control and the server tags used to create them, along with a sample custom template:
DateTime2Line:
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
1
2
3
4
5
6
7
8
9
10
11
12
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
AM
PM
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpDateTime2Line" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="DateTime2Line" MonthFormat="Abbreviated"/>
TimeDate2Line:
1
2
3
4
5
6
7
8
9
10
11
12
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
AM
PM
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpTimeDate2Line" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="TimeDate2Line" MonthFormat="Abbreviated"/>
Date:
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpDate" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="Date" MonthFormat="Abbreviated"/>
Time:
1
2
3
4
5
6
7
8
9
10
11
12
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
AM
PM
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpTime" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="Time" MonthFormat="Abbreviated"/>
DateTime1Line:
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
1
2
3
4
5
6
7
8
9
10
11
12
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
AM
PM
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpDateTime1Line" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="DateTime1Line" MonthFormat="Abbreviated"/>
TimeDate1Line:
1
2
3
4
5
6
7
8
9
10
11
12
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
AM
PM
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpTimeDate1Line" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" Layout="TimeDate1Line" MonthFormat="Abbreviated"/>
Templated:
(Used regardless of Layout property if a template is supplied)
0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
:
00
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec
/
Wednesday 1
Thursday 2
Friday 3
Saturday 4
Sunday 5
Monday 6
Tuesday 7
Wednesday 8
Thursday 9
Friday 10
Saturday 11
Sunday 12
Monday 13
Tuesday 14
Wednesday 15
Thursday 16
Friday 17
Saturday 18
Sunday 19
Monday 20
Tuesday 21
Wednesday 22
Thursday 23
Friday 24
Saturday 25
Sunday 26
Monday 27
Tuesday 28
Wednesday 29
/
1975
1976
1977
1978
1979
1980
1981
1982
1983
1984
1985
1986
1987
1988
1989
1990
1991
1992
1993
1994
1995
1996
1997
1998
1999
2000
2001
2002
2003
2004
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
[SelectedDateTime]
<NJS:DateTimePickerTemplated ID="dtpTemplated" runat="server" DayFormat="Full" FirstYear="1975" LastYear="2025" MonthFormat="Abbreviated"> <LayoutTemplate> <asp:DropDownList ID="ddlHour" runat="server"/><span> : </span><asp:DropDownList ID="ddlMinute" runat="server"/><br/> <asp:DropDownList ID="ddlMonth" runat="server"/><span> / </span><asp:DropDownList ID="ddlDate" runat="server"/><span> / </span><asp:DropDownList ID="ddlYear" runat="server"/> </LayoutTemplate> </NJS:DateTimePickerTemplated>
Properties & Methods
DateTimePickerTemplated
The DateTimePickerTemplated control is a templated version of the
DateTimePicker
control and is used to select a date and/or time using either a custom or predefined template
SelectedDateTime
- The currently selected date and time
FirstYear
- The first year displayed in the year DropDownList if the selected layout includes a date. If this value is greater than the year of SelectedDateTime it will be automatically adjusted
LastYear
- The last year displayed in the year DropDownList if the selected layout includes a date. If this value is less than the year of SelectedDateTime it will be automatically adjusted
DayFormat
- A member of the DayNameStyle enumeration specifying how and whether or not the day of the week should be displayed as part of the day DropDownList
MonthFormat
- A member of the MonthNameStyle enumeration specifying the format for the month DropDownList
Layout
- A member of the DTPLayout enumeration specifying the layout of the date and/or time DropDownLists
LayoutTemplate
- The ITemplate in which the included DropDownLists and other controls are specified
DateTimePickerTemplated.DayNameStyle As Byte
An enumeration used to specify the format in which to display the day DropDownList
None
- Displays the day as an integer
Full
- Displays the day of the week followed by the day of the month
Short
- Displays the day of the week abbreviation followed by the day of the month
FirstLetter
- Displays the first letter of the day of the week followed by the day of the month
FirstTwoLetters
- Displays the first two letters of the day of the week followed by the day of the month
DateTimePickerTemplated.MonthNameStyle As Byte
An enumeration used to specify the format in which to display the month DropDownList
Full
- Displays the complete name of the month
Abbreviated
- Displays the abbreviated name of the month
Numeric
- Displays the month as a number from 1-12
DateTimePickerTemplated.DTPLayout As Byte
An enumeration used to specify the layout in which to display the date and/or time DropDownLists
DateTime2Line
- Displays the date followed by a
and the time
TimeDate2Line
- Displays the time followed by a
and the date
Date
- Displays only the date
Time
- Displays only the time
DateTime1Line
- Displays the date followed by the time
TimeDate1Line
- Displays the time followed by the date
Source Code
DateTimePickerTemplated.vb:
Namespace NathanSokalski Public Class DateTimePickerTemplated : Inherits System.Web.UI.WebControls.CompositeControl : Implements ICallbackEventHandler, IPostBackDataHandler Private _firstyear As Integer = 1950 Private _lastyear As Integer = 2050 Private _dayformat As DayNameStyle = DayNameStyle.None Private _monthformat As MonthNameStyle = MonthNameStyle.Abbreviated Private _layout As DTPLayout = DTPLayout.DateTime2Line Private _layouttemplate As ITemplate Private passedvalue As String = String.Empty Public Event SelectedDateTimeChanged As EventHandler <Description("The currently selected date and time")> Public Property SelectedDateTime() As DateTime Get If IsNothing(Me.ViewState("SelectedDateTime")) Then Return DateTime.Now Else Return CDate(Me.ViewState("SelectedDateTime")) End Get Set(ByVal value As DateTime) Me.ViewState("SelectedDateTime") = value End Set End Property <DefaultValue(1950), _ Description("The first year displayed in the year DropDownList")> _ Public Property FirstYear() As Integer Get Return Me._firstyear End Get Set(ByVal value As Integer) Me._firstyear = value End Set End Property <DefaultValue(2050), _ Description("The last year displayed in the year DropDownList")> _ Public Property LastYear() As Integer Get Return Me._lastyear End Get Set(ByVal value As Integer) Me._lastyear = value End Set End Property <DefaultValue("None"), _ Description("The format of the day of the week in the day DropDownList")> _ Public Property DayFormat() As DayNameStyle Get Return Me._dayformat End Get Set(ByVal value As DayNameStyle) Me._dayformat = value End Set End Property <DefaultValue("Abbreviated"), _ Description("The format of the month in the month DropDownList")> _ Public Property MonthFormat() As MonthNameStyle Get Return Me._monthformat End Get Set(ByVal value As MonthNameStyle) Me._monthformat = value End Set End Property <DefaultValue("DateTime2Line"), _ Description("The layout of the date and/or time DropDownLists")> _ Public Property Layout() As DTPLayout Get Return Me._layout End Get Set(ByVal value As DTPLayout) Me._layout = value End Set End Property <TemplateContainer(GetType(NathanSokalski.DateTimePickerTemplated)), PersistenceMode(PersistenceMode.InnerProperty)> Public Property LayoutTemplate() As ITemplate Get Return Me._layouttemplate End Get Set(ByVal value As ITemplate) Me._layouttemplate = value End Set End Property Protected Overrides Sub CreateChildControls() If IsNothing(Me._layouttemplate) Then Select Case Me.Layout Case DTPLayout.Date : Me._layouttemplate = New DateTimePickerTemplates.DateTemplate() Case DTPLayout.DateTime1Line : Me._layouttemplate = New DateTimePickerTemplates.DateTime1LineTemplate() Case DTPLayout.DateTime2Line : Me._layouttemplate = New DateTimePickerTemplates.DateTime2LineTemplate() Case DTPLayout.Time : Me._layouttemplate = New DateTimePickerTemplates.TimeTemplate() Case DTPLayout.TimeDate1Line : Me._layouttemplate = New DateTimePickerTemplates.TimeDate1LineTemplate() Case DTPLayout.TimeDate2Line : Me._layouttemplate = New DateTimePickerTemplates.TimeDate2LineTemplate() End Select End If Me._layouttemplate.InstantiateIn(Me) End Sub Public Function GetCallbackResult() As String Implements System.Web.UI.ICallbackEventHandler.GetCallbackResult 'To Browser: id|index|daycount|day1fmt|day2fmt|day3fmt|day4fmt|day5fmt|day6fmt|day7fmt 'To Server: yearval monthval dayval Dim ymdvalues() As String = Me.passedvalue.Split(" "c) Dim daycount As Integer = DateTime.DaysInMonth(CInt(ymdvalues(0)), CInt(ymdvalues(1))) Dim datedata As New Collections.Generic.List(Of String) Dim ctrls As IEnumerator = Me.Controls.GetEnumerator() While ctrls.MoveNext() If CType(ctrls.Current, Control).ID = "ddlDate" Then datedata.Add(CType(ctrls.Current, Control).ClientID) : Exit While End While datedata.Add((Math.Min(CInt(ymdvalues(2)), daycount) - 1).ToString()) datedata.Add(daycount.ToString()) For i As Integer = 1 To 7 Select Case Me.DayFormat Case DayNameStyle.FirstLetter : datedata.Add(String.Concat(New DateTime(CInt(ymdvalues(0)), CInt(ymdvalues(1)), i).DayOfWeek.ToString().Substring(0, 1), " ")) Case DayNameStyle.FirstTwoLetters : datedata.Add(String.Concat(New DateTime(CInt(ymdvalues(0)), CInt(ymdvalues(1)), i).DayOfWeek.ToString().Substring(0, 2), " ")) Case DayNameStyle.Full : datedata.Add(String.Concat(New DateTime(CInt(ymdvalues(0)), CInt(ymdvalues(1)), i).DayOfWeek.ToString(), " ")) Case DayNameStyle.None : datedata.Add(String.Empty) Case DayNameStyle.Short : datedata.Add(String.Concat(System.Globalization.DateTimeFormatInfo.CurrentInfo.AbbreviatedDayNames(New DateTime(CInt(ymdvalues(0)), CInt(ymdvalues(1)), i).DayOfWeek), " ")) End Select Next Return String.Join("|", datedata.ToArray()) End Function Public Sub RaiseCallbackEvent(ByVal eventArgument As String) Implements System.Web.UI.ICallbackEventHandler.RaiseCallbackEvent Me.passedvalue = eventArgument End Sub Public Function LoadPostData(ByVal postDataKey As String, ByVal postCollection As System.Collections.Specialized.NameValueCollection) As Boolean Implements System.Web.UI.IPostBackDataHandler.LoadPostData Me.EnsureChildControls() Dim prevdatetime As DateTime = Me.SelectedDateTime Dim ddlYear = String.Empty, ddlMonth = String.Empty, ddlDate = String.Empty, ddlHour = String.Empty, ddlMinute = String.Empty, ddlSecond = String.Empty, ddlAMPM As String = String.Empty Dim yearvalue, monthvalue, dayvalue, hourvalue, minutevalue, secondvalue As Integer Dim temp As DropDownList Dim ctrls As IEnumerator = Me.Controls.GetEnumerator() 'Get UniqueID values for existing controls While ctrls.MoveNext() If ctrls.Current.GetType() Is GetType(DropDownList) Then temp = CType(ctrls.Current, DropDownList) Select Case temp.ID Case "ddlYear" : ddlYear = temp.UniqueID Case "ddlMonth" : ddlMonth = temp.UniqueID Case "ddlDate" : ddlDate = temp.UniqueID Case "ddlHour" : ddlHour = temp.UniqueID Case "ddlMinute" : ddlMinute = temp.UniqueID Case "ddlSecond" : ddlSecond = temp.UniqueID Case "ddlAMPM" : ddlAMPM = temp.UniqueID End Select End If End While 'Get postback values or DateTime.MinValue for each DateTime component If String.IsNullOrEmpty(ddlYear) OrElse IsNothing(postCollection(ddlYear)) Then yearvalue = DateTime.MinValue.Year Else yearvalue = CInt(postCollection(ddlYear)) If String.IsNullOrEmpty(ddlMonth) OrElse IsNothing(postCollection(ddlMonth)) Then monthvalue = DateTime.MinValue.Month Else monthvalue = CInt(postCollection(ddlMonth)) If String.IsNullOrEmpty(ddlDate) OrElse IsNothing(postCollection(ddlDate)) Then dayvalue = DateTime.MinValue.Day Else dayvalue = CInt(postCollection(ddlDate)) If String.IsNullOrEmpty(ddlHour) OrElse IsNothing(postCollection(ddlHour)) Then hourvalue = DateTime.MinValue.Hour Else If String.IsNullOrEmpty(ddlAMPM) OrElse IsNothing(postCollection(ddlAMPM)) Then hourvalue = CInt(postCollection(ddlHour)) Else hourvalue = (CInt(postCollection(ddlHour)) Mod 12) + CInt(postCollection(ddlAMPM)) End If End If If String.IsNullOrEmpty(ddlMinute) OrElse IsNothing(postCollection(ddlMinute)) Then minutevalue = DateTime.MinValue.Minute Else minutevalue = CInt(postCollection(ddlMinute)) If String.IsNullOrEmpty(ddlSecond) OrElse IsNothing(postCollection(ddlSecond)) Then secondvalue = DateTime.MinValue.Second Else secondvalue = CInt(postCollection(ddlSecond)) Me.SelectedDateTime = New DateTime(yearvalue, monthvalue, dayvalue, hourvalue, minutevalue, secondvalue) Return prevdatetime <> Me.SelectedDateTime End Function Public Sub RaisePostDataChangedEvent() Implements System.Web.UI.IPostBackDataHandler.RaisePostDataChangedEvent RaiseEvent SelectedDateTimeChanged(Me, System.EventArgs.Empty) End Sub Private Sub Ctrl_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender Me.EnsureChildControls() Dim ctrls As IEnumerator = Me.Controls.GetEnumerator() Dim ddlYear, ddlMonth, ddlDate, ddlHour, ddlMinute, ddlSecond, ddlAMPM, temp As DropDownList 'Populate existing DropDownLists While ctrls.MoveNext() If ctrls.Current.GetType() Is GetType(DropDownList) Then temp = CType(ctrls.Current, DropDownList) Select Case temp.ID Case "ddlYear" : ddlYear = temp Me.FirstYear = Math.Min(Me.SelectedDateTime.Year, Me.FirstYear) Me.LastYear = Math.Max(Me.SelectedDateTime.Year, Me.LastYear) temp.Items.Clear() For i As Integer = Me.FirstYear To Me.LastYear temp.Items.Add(i.ToString()) Next Case "ddlMonth" : ddlMonth = temp temp.Items.Clear() For i As Integer = 1 To 12 Select Case Me.MonthFormat Case MonthNameStyle.Abbreviated : temp.Items.Add(New ListItem(System.Globalization.DateTimeFormatInfo.CurrentInfo.GetAbbreviatedMonthName(i), i.ToString())) Case MonthNameStyle.Full : temp.Items.Add(New ListItem(System.Globalization.DateTimeFormatInfo.CurrentInfo.GetMonthName(i), i.ToString())) Case MonthNameStyle.Numeric : temp.Items.Add(i.ToString()) End Select Next Case "ddlDate" : ddlDate = temp Dim day As String = String.Empty temp.Items.Clear() For i As Integer = 1 To DateTime.DaysInMonth(Me.SelectedDateTime.Year, Me.SelectedDateTime.Month) Select Case Me.DayFormat Case DayNameStyle.FirstLetter : day = New DateTime(Me.SelectedDateTime.Year, Me.SelectedDateTime.Month, i).DayOfWeek.ToString().Substring(0, 1) Case DayNameStyle.FirstTwoLetters : day = New DateTime(Me.SelectedDateTime.Year, Me.SelectedDateTime.Month, i).DayOfWeek.ToString().Substring(0, 2) Case DayNameStyle.Full : day = New DateTime(Me.SelectedDateTime.Year, Me.SelectedDateTime.Month, i).DayOfWeek.ToString() Case DayNameStyle.None : day = String.Empty Case DayNameStyle.Short : day = System.Globalization.DateTimeFormatInfo.CurrentInfo.AbbreviatedDayNames(New DateTime(Me.SelectedDateTime.Year, Me.SelectedDateTime.Month, i).DayOfWeek) End Select temp.Items.Add(New ListItem(String.Format("{0} {1}", day, i).TrimStart(" "c), i.ToString())) Next Case "ddlHour" : ddlHour = temp Case "ddlMinute" : ddlMinute = temp temp.Items.Clear() For i As Byte = 0 To 59 temp.Items.Add(i.ToString("00")) Next Case "ddlSecond" : ddlSecond = temp temp.Items.Clear() For i As Byte = 0 To 59 temp.Items.Add(i.ToString("00")) Next Case "ddlAMPM" : ddlAMPM = temp temp.Items.Clear() temp.Items.Add(New ListItem("AM", "0")) temp.Items.Add(New ListItem("PM", "12")) End Select End If End While 'Populate ddlHour DropDownList If Not IsNothing(ddlHour) Then ddlHour.Items.Clear() If IsNothing(ddlAMPM) Then For i As Byte = 0 To 23 ddlHour.Items.Add(i.ToString()) Next Else For i As Byte = 1 To 12 ddlHour.Items.Add(i.ToString()) Next End If End If 'Select correct items in existing DropDownLists If Not IsNothing(ddlAMPM) Then ddlAMPM.SelectedIndex = CInt(Math.Floor(Me.SelectedDateTime.Hour / 12)) If Not IsNothing(ddlHour) Then If IsNothing(ddlAMPM) Then ddlHour.SelectedIndex = Me.SelectedDateTime.Hour Else ddlHour.SelectedIndex = (Me.SelectedDateTime.Hour + 11) Mod 12 If Not IsNothing(ddlMinute) Then ddlMinute.SelectedIndex = Me.SelectedDateTime.Minute If Not IsNothing(ddlSecond) Then ddlSecond.SelectedIndex = Me.SelectedDateTime.Second If Not IsNothing(ddlYear) Then ddlYear.SelectedValue = Me.SelectedDateTime.Year.ToString() If Not IsNothing(ddlMonth) Then ddlMonth.SelectedIndex = Me.SelectedDateTime.Month - 1 If Not IsNothing(ddlDate) Then ddlDate.SelectedIndex = Me.SelectedDateTime.Day - 1 If Not (IsNothing(ddlYear) OrElse IsNothing(ddlMonth) OrElse IsNothing(ddlDate)) Then Me.Page.RegisterRequiresPostBack(Me) Dim arg As String = String.Format("document.getElementById('{0}').value+' '+document.getElementById('{1}').value+' '+document.getElementById('{2}').value", ddlYear.ClientID, ddlMonth.ClientID, ddlDate.ClientID) Dim callback As String = Me.Page.ClientScript.GetCallbackEventReference(Me, arg, "UpdateDateTimePicker", Nothing) ddlMonth.Attributes.Add("onchange", callback) ddlYear.Attributes.Add("onchange", callback) If Not Me.Page.ClientScript.IsClientScriptBlockRegistered("UpdateDateTimePicker") Then Dim clientupdater As New System.Text.StringBuilder("function UpdateDateTimePicker(datedata){") clientupdater.Append("var datedataparts=datedata.split('|');") clientupdater.Append("var dayddl=document.getElementById(datedataparts[0]);") clientupdater.Append("dayddl.length=0;") clientupdater.Append("for(x=0;x<parseInt(datedataparts[2]);x++){dayddl.options[x]=new Option(datedataparts[x%7+3]+(x+1),x+1);}") clientupdater.Append("dayddl.selectedIndex=parseInt(datedataparts[1]);") clientupdater.Append("}") Me.Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "UpdateDateTimePicker", clientupdater.ToString(), True) End If End If End Sub Public Enum DayNameStyle As Byte None Full [Short] FirstLetter FirstTwoLetters End Enum Public Enum MonthNameStyle As Byte Full Abbreviated Numeric End Enum Public Enum DTPLayout As Byte DateTime2Line TimeDate2Line [Date] Time DateTime1Line TimeDate1Line End Enum End Class Namespace DateTimePickerTemplates Public Class DateTime2LineTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlMonth As New DropDownList() ddlMonth.ID = "ddlMonth" container.Controls.Add(ddlMonth) Dim ddlDate As New DropDownList() ddlDate.ID = "ddlDate" container.Controls.Add(ddlDate) Dim ddlYear As New DropDownList() ddlYear.ID = "ddlYear" container.Controls.Add(ddlYear) container.Controls.Add(New LiteralControl("<br/>")) Dim ddlHour As New DropDownList() ddlHour.ID = "ddlHour" container.Controls.Add(ddlHour) Dim ddlMinute As New DropDownList() ddlMinute.ID = "ddlMinute" container.Controls.Add(ddlMinute) Dim ddlSecond As New DropDownList() ddlSecond.ID = "ddlSecond" container.Controls.Add(ddlSecond) Dim ddlAMPM As New DropDownList() ddlAMPM.ID = "ddlAMPM" container.Controls.Add(ddlAMPM) End Sub End Class Public Class TimeDate2LineTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlHour As New DropDownList() ddlHour.ID = "ddlHour" container.Controls.Add(ddlHour) Dim ddlMinute As New DropDownList() ddlMinute.ID = "ddlMinute" container.Controls.Add(ddlMinute) Dim ddlSecond As New DropDownList() ddlSecond.ID = "ddlSecond" container.Controls.Add(ddlSecond) Dim ddlAMPM As New DropDownList() ddlAMPM.ID = "ddlAMPM" container.Controls.Add(ddlAMPM) container.Controls.Add(New LiteralControl("<br/>")) Dim ddlMonth As New DropDownList() ddlMonth.ID = "ddlMonth" container.Controls.Add(ddlMonth) Dim ddlDate As New DropDownList() ddlDate.ID = "ddlDate" container.Controls.Add(ddlDate) Dim ddlYear As New DropDownList() ddlYear.ID = "ddlYear" container.Controls.Add(ddlYear) End Sub End Class Public Class DateTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlMonth As New DropDownList() ddlMonth.ID = "ddlMonth" container.Controls.Add(ddlMonth) Dim ddlDate As New DropDownList() ddlDate.ID = "ddlDate" container.Controls.Add(ddlDate) Dim ddlYear As New DropDownList() ddlYear.ID = "ddlYear" container.Controls.Add(ddlYear) End Sub End Class Public Class TimeTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlHour As New DropDownList() ddlHour.ID = "ddlHour" container.Controls.Add(ddlHour) Dim ddlMinute As New DropDownList() ddlMinute.ID = "ddlMinute" container.Controls.Add(ddlMinute) Dim ddlSecond As New DropDownList() ddlSecond.ID = "ddlSecond" container.Controls.Add(ddlSecond) Dim ddlAMPM As New DropDownList() ddlAMPM.ID = "ddlAMPM" container.Controls.Add(ddlAMPM) End Sub End Class Public Class DateTime1LineTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlMonth As New DropDownList() ddlMonth.ID = "ddlMonth" container.Controls.Add(ddlMonth) Dim ddlDate As New DropDownList() ddlDate.ID = "ddlDate" container.Controls.Add(ddlDate) Dim ddlYear As New DropDownList() ddlYear.ID = "ddlYear" container.Controls.Add(ddlYear) Dim ddlHour As New DropDownList() ddlHour.ID = "ddlHour" container.Controls.Add(ddlHour) Dim ddlMinute As New DropDownList() ddlMinute.ID = "ddlMinute" container.Controls.Add(ddlMinute) Dim ddlSecond As New DropDownList() ddlSecond.ID = "ddlSecond" container.Controls.Add(ddlSecond) Dim ddlAMPM As New DropDownList() ddlAMPM.ID = "ddlAMPM" container.Controls.Add(ddlAMPM) End Sub End Class Public Class TimeDate1LineTemplate : Implements ITemplate Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn Dim ddlHour As New DropDownList() ddlHour.ID = "ddlHour" container.Controls.Add(ddlHour) Dim ddlMinute As New DropDownList() ddlMinute.ID = "ddlMinute" container.Controls.Add(ddlMinute) Dim ddlSecond As New DropDownList() ddlSecond.ID = "ddlSecond" container.Controls.Add(ddlSecond) Dim ddlAMPM As New DropDownList() ddlAMPM.ID = "ddlAMPM" container.Controls.Add(ddlAMPM) Dim ddlMonth As New DropDownList() ddlMonth.ID = "ddlMonth" container.Controls.Add(ddlMonth) Dim ddlDate As New DropDownList() ddlDate.ID = "ddlDate" container.Controls.Add(ddlDate) Dim ddlYear As New DropDownList() ddlYear.ID = "ddlYear" container.Controls.Add(ddlYear) End Sub End Class End Namespace End Namespace
Remarks
When creating a LayoutTemplate, you must use the following IDs for the DropDownLists you include: ddlYear, ddlMonth, ddlDate, ddlHour, ddlMinute, ddlSecond, and ddlAMPM. If the ddlAMPM DropDownList is not included the 24-hour format will be used for the ddlHour DropDownList. Any other DropDownLists that are not included in the Template will be given the value of DateTime.MinValue when doing a postback. For example, if the ddlYear DropDownList is not included in the Template, the year used for SelectedDateTime will be DateTime.MinValue.Year.