More Date Oriented Controls
Back
There are many ways to gather date and time values from the user. Here are more controls
that are included in Peter's Date and Time.
MonthYearTextBox
This variation of the DateTextBox omits the day part of the date. Use it to when
you need to retrieve the month and year, such as for credit card expiration dates.
It has nearly all the same properties and features as DateTextBox. Instead of a
popup calendar, it offers the popup MonthYearPicker. The DateTextBox validators
support this control.
Here is the same control but with a different format for the popup MonthYearPicker
called "FewYearsPicker":
AnniversaryTextBox
This variation of the DateTextBox omits the year part of the date. Use it to when
you need to retrieve the month and day, for dates that recur annually, like an anniversary
or a holiday. It has nearly all the same properties and features as DateTextBox.
One key difference is that the popup calendar never shows the year and only reflects
dates from January 1 to December 31 of one year. The DateTextBox validators support
this control.
QuickDateMenu
This is a special popup menu with a list of dates the user is likely to enter so
the user can avoid typing. When the QuickDateMenu is connected to a date range,
it can have terms like "This Week", "Last Month", and "Year To Date". You can define
dates using a "relative date" rule, where you describe how to calculate a date offset
from today such as "The first day of 1 week ago" and "The last day of the year."
Start Date
End Date
Popup Calendar
This is popup version of Calendar. While it is built into the DateTextBox control,
you can add it to your own Textboxes and other interfaces.
The PopupCalendar contains two parts, a toggle button and the Calendar control that
is initially hidden. The toggle button can be textual, an HTML button, or an image.
It supports effects when you press the mouse on it. When the user clicks on the
toggle button, the Calendar appears.
The documentation details how to hookup JavaScript to pass values between your fields
and the PopupCalendar.
Click here:
MonthYearPicker
This is a special kind of calendar that shows only months and years. It is used
by the Calendar to jump quickly to any month/year. However, you can use it yourself.
One possible application is for credit card expiration date selection without a
textbox. The MonthYearPicker supports a keyboard entry that allows the user to type
the month name and the year to move the selected cells. It also offers numerous
formatting options.
Jan | Jul |
Feb | Aug |
Mar | Sep |
Apr | Oct |
May | Nov |
Jun | Dec |
|
2019 | 2024 |
2020 | 2025 |
2021 | 2026 |
2022 | 2027 |
2023 | 2028 |
|
|
|
Here is the same control but with a different format for the popup MonthYearPicker
called "FewYearsPicker":
2023 |
Jan | Feb | Mar | Apr | May | Jun |
Jul | Aug | Sep | Oct | Nov | Dec |
2024 |
Jan | Feb | Mar | Apr | May | Jun |
Jul | Aug | Sep | Oct | Nov | Dec |
PopupMonthYearPicker
This is a popup version of the MonthYearPicker. While it is built into the Calendar,
you can use it on your own textboxes, perhaps to support credit card expiration
date entry.
It contains two parts, a toggle button and the MonthYearPicker control that is initially
hidden. The toggle button can be textual, an HTML button, or an image. It supports
effects when you press the mouse on it. When the user clicks on the toggle button,
the MonthYearPicker appears.
The documentation details how to hookup JavaScript to pass values between your fields
and the PopupCalendar.
Click here:
TimePicker
Provides a list of times or durations from which the user can select one value.
Its formatting can show multiple rows and columns. You can insert title rows such
as "Morning" and "Afternoon". Times can be unselectable and some cells of the timepicker
can have non-time related information, such as a blank cell.
This control is built into the TimeOfDayTextBox and DurationTextBox.
Morning |
9:00 AM | 9:30 AM | 10:00 AM |
10:30 AM | 11:00 AM | 11:30 AM |
Afternoon |
12:00 PM | 12:30 PM | 1:00 PM |
1:30 PM | 2:00 PM | 2:30 PM |
3:00 PM | | |
PopupTimePicker
A popup version of the TimePicker.
Click here:
Back