Table of Contents
Enumerations
Name | Values |
---|---|
This class exposes no enumerations. |
Constants
Name | Type | Value |
---|---|---|
MinViewDays | Integer | 0 |
MinViewMonth | Integer | 1 |
MinViewYears | Integer | 2 |
PositionBottomLeft | String | “top left” |
PositionBottomRight | String | “top right” |
PositionTopLeft | String | “bottom left” |
PositionTopRight | String | “bottom right” |
ViewMonth | Integer | 0 |
ViewYear | Integer | 1 |
ViewDecade | Integer | 2 |
Events
Definition | Description |
---|---|
MonthChange( theMonth as Integer ) | Fired when the user navigates to a different month in the display. |
PickerCleared() | Fired when the user clears the selection. |
PickerHidden() | Fired when the picker is hidden, either by user selection or cancellation. |
PickerShown() | Fired when the picker is shown by user interaction. |
TextChanged( newText as String ) | Fired when datepicker field loses focus. If ForceParse = False, newText will contain the invalid text the user attempted to enter as a date value. At that point, it is up to the developer to properly handle this text as you see fit and update the Value property. |
ValueChange() | Fired when the user either makes a new selection from the popup or enters a valid date in the field. |
YearChange( theYear as Integer ) | Fired when the user navigates to a different Year in the display. |
Methods
Definition | Description |
---|---|
ClearValue() | Resets the date value to null in the picker. |
DisableDate( theDate as Date ) | Disables selection of the specified date. |
EnableDate( theDate as Date ) | Enabled selection of a previously disabled date. |
HidePicker() | Hides the picker popup. |
SetDayEnabled( theDay as Integer, theValue as Boolean ) | Allows for the enabling or disabling of a specific day of the week. theDay is a zero-based index of the day of the weekday, with 0 representing Sunday. |
SetDayHighlighted( theValue as Boolean, ParamArray theDays as Integer ) | Highlights the days specified by theDays, which should be a list of Integers with 0 representing Sunday. |
ShowPicker() | Shows the picker. |
Properties
Name | Type | Default Value | Description |
---|---|---|---|
AutoClose | Boolean | True | If True, when the user makes a selection the picker is hidden. |
AvailableLanguages() | Array of String | Null | An array containing the locale IDs of the languages supported by the picker. |
CalendarWeeks | Boolean | False | When True, will display the week number to the left of the calendar rows. |
Day0Enabled | Boolean | True | When False, users will be unable to select days occurring on a Sunday. |
Day0Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day1Enabled | Boolean | True | When False, users will be unable to select days occurring on a Monday. |
Day1Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day2Enabled | Boolean | True | When False, users will be unable to select days occurring on a Tuesday. |
Day2Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day3Enabled | Boolean | True | When False, users will be unable to select days occurring on a Wednesday. |
Day3Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day4Enabled | Boolean | True | When False, users will be unable to select days occurring on a Thursday. |
Day4Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day5Enabled | Boolean | True | When False, users will be unable to select days occurring on a Friday. |
Day5Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
Day6Enabled | Boolean | True | When False, users will be unable to select days occurring on a Saturday. |
Day6Highlighted | Boolean | False | When True, this day of the week will be highlighted. |
DefaultViewDate | Date | Today | Date to view when initially opening the calendar. The internal value of the date remains today as default, but when the datepicker is first opened the calendar will open to defaultViewDate rather than today. If this option is not used, “today” remains the default view date. |
DisableKeyboard | Boolean | False | If True, no keyboard will show on mobile devices. |
EndDate | Date | End of Time | The latest date that may be selected; all later dates will be disabled. |
ForceParse | Boolean | True | Forces the user to conform to the expected date format. If False, the TextChanged event will fire with their text entry, and the field will not be cleared. |
Format | String | DD, MM dd, yyyy | Determines how dates are shown and parsed when the user selects or enters a date in the field. |
d, dd: Numeric date, no leading zero and leading zero, respectively. Eg, 5, 05. | |||
D, DD: Abbreviated and full weekday names, respectively. Eg, Mon, Monday. | |||
m, mm: Numeric month, no leading zero and leading zero, respectively. Eg, 7, 07. | |||
M, MM: Abbreviated and full month names, respectively. Eg, Jan, January | |||
yy, yyyy: 2- and 4-digit years, respectively. Eg, 12, 2012. | |||
KeyboardNavigation | Boolean | True | Allows the user to navigate the picker using the arrow keys on their keyboard. |
Language | String | “en” | The IETF code (eg “en” for English, “pt-BR” for Brazilian Portuguese) of the language to use for month and day names. See AvailableLanguages() Property, or scripts/datepicker/langs directory. |
MinView | Integer | MinViewDays | The minimum view allowed for display in the selection picker. See MinView constants. |
Orientation | String | “auto” | A space-separated string consisting of one or two of “left” or “right”, “top” or “bottom”, and “auto” (may be omitted); for example, “top left”, “bottom” (horizontal orientation will default to “auto”), “right” (vertical orientation will default to “auto”), “auto top”. Allows for fixed placement of the picker popup. “orientation” refers to the location of the picker popup’s “anchor”; you can also think of it as the location of the trigger element (input, component, etc) relative to the picker. “auto” triggers “smart orientation” of the picker. Horizontal orientation will default to “left” and left offset will be tweaked to keep the picker inside the browser viewport; vertical orientation will simply choose “top” or “bottom”, whichever will show more of the picker in the viewport. See Position constants. |
ReadOnly | Boolean | False | If True, the textfield of the DatePicker will be disabled, but selection can still be made from the picker. |
ShowOnFocus | Boolean | True | If False, the picker will only be shown by calling the ShowPicker() method. |
StartDate | Date | Beginning of Time | The earliest date that may be selected; all earlier dates will be disabled. |
StylePicker | WebStyle | Nil | WebStyle applied to the picker popup. |
StylePickerDayHover | WebStyle | Nil | WebStyle applied to the date currently being hovered by the user's mouse in the picker popup. |
StylePickerToday | WebStyle | Nil | WebStyle applied to the current date in the picker popup. |
TodayButton | Boolean | False | If True, will show a “Today” button in the picker allowing users to quickly switch the view to display the current date. |
TodayHighlight | Boolean | True | If True, will signify the current date in the picker view using a background color. |
ToggleSelect | Boolean | False | If True, selecting the currently active date in the datepicker will unset the respective date. |
Value | Date | Nil | The currently selected value. |
WeekStart | Integer | 0 | The weekday to use as the starting date of the picker display, zero-based starting with Sunday. |
Notes
ForceParse = True
When ForceParse = True and the user types in the textbox, the underlying library will automatically parse the date based on the value supplied in the Format property, then fire the ValueChange event after the Value property is updated. In this event, you can access the Value property to retrieve the user-entered date. In this scenario there is no need for a TextChanged event as valid inputs will trigger the ValueChange event and update the Value property. TextChanged is disabled as it is unnecessary, the DatePicker handles the input appropriately.
ForceParse = False
The class does not automatically parse the text entered, and you are expected to do that in the TextChanged event, which has a parameter of newText as String. Using this parameter, you are expected to parse the date however you wish and update the Value of the control yourself. The class does not track the text within the textbox in a property because it should be a textual representation of the Date object stored in the Value property. ValueChange is disabled as it would only fire after you have just set the Value, therefore know that the value has changed.
Examples
Mobile Keyboard
For mobile devices, you can automatically set whether the keyboard will be displayed by using a condition like this to set the appropriate option:
Sub Shown() Handles Shown select case Session.Browser case WebSession.BrowserType.Android, _ WebSession.BrowserType.Blackberry, _ WebSession.BrowserType.OperaMini, _ WebSession.BrowserType.SafariMobile me.DisableTouchKeyboard = True case else me.DisableTouchKeyboard = False end select End Sub
As of R27, this property is renamed to DisableKeyboard.
Changes to this Page
Date | Edit | Editor |
---|---|---|
07/25/2017 | Added Xojo Docs Links | Anthony G. Cyphers |
07/24/2017 | Document Created | Anthony G. Cyphers |