DateTimeField

A field combining a DateField and a TimeField.

Date time field
//<code-header>
fiddle.title = 'Date time field';
//</code-header>
new DateTimeField({
    appendTo      : targetElement,
    value         : new Date(2021, 0, 5, 12, 40),
    label         : 'Enter date & time',
    rendition     : 'outlined',
    labelPosition : 'above'
});

new DateTimeField({
    appendTo      : targetElement,
    value         : new Date(2021, 0, 5, 12, 40),
    label         : 'Enter date & time',
    rendition     : 'filled',
    labelPosition : 'above'
});

Input configuration properties (such as inputWidth, inputAlign, autoComplete, inputAttributes, inputType, spellCheck, tabIndex, and validateOnInput) cannot be set directly on DateTimeField. Instead, configure them individually on the underlying dateField and timeField configuration objects.

Configs

111

Common

listenersEvents

Other

rendition: outlined | filled | StringAlso a property

Predefined style to use for the field. Possible values are:

  • 'outlined' (default)
  • 'filled'

The supplied value will be part of the field's class list, as b-text-field-{rendition}.

weekStartDay: Number

The week start day in the picker, 0 meaning Sunday, 6 meaning Saturday. Uses localized value per default.

autoSelectField
callOnFunctionsWidget
catchEventHandlerExceptionsEvents
clearableField
columnWidget
detectCSSCompatibilityIssuesWidget
editableField
highlightExternalChangeField
keyStrokeChangeDelayField
nameField
placeholderField
readOnlyField
requiredField
revertOnEscapeField
rtlRTL
showRequiredIndicatorField
skipValidationField
spanWidget
triggersField
valueField

Accessibility

ariaDescriptionWidget
ariaLabelWidget
keyMapKeyMap

Container

containerField
containValuesField
inlineField

CSS

clsWidget
colorWidget
contentElementClsWidget
htmlClsWidget
styleWidget
uiWidget

DOM

adoptWidget
appendToWidget
contentWidget
datasetWidget
htmlWidget
idWidget
insertBeforeWidget
insertFirstWidget
tagWidget
titleWidget

Float & align

alignWidget
anchorWidget
centeredWidget
constrainToWidget
draggableWidget
floatingWidget
hideAnimationWidget
maximizeOnMobileWidget
positionedWidget
scrollActionWidget
showAnimationWidget
xWidget
yWidget

Input element

autoCompleteField
inputAlignField
inputAttributesField
inputTagField
inputTypeField
inputWidthField
spellCheckField
tabIndexField
validateOnInputField

Label

hintField
hintHtmlField
labelLabelable
labelClsLabelable
labelPositionLabelable
labelsField
labelWidthLabelable

Layout

alignSelfWidget
dockWidget
flexWidget
heightWidget
hiddenWidget
marginWidget
maxHeightWidget
maxWidthWidget
minHeightWidget
minWidthWidget
textAlignWidget
weightWidget
widthWidget

Misc

badgeBadge
bubbleEventsEvents
dataFieldWidget
defaultBindPropertyWidget
disabledWidget
elementAttributesWidget
ignoreParentReadOnlyWidget
localeClassLocalizable
localizableLocalizable
localizablePropertiesLocalizable
maskDefaultsWidget
maskedWidget
monitorResizeWidget
ownerWidget
preventTooltipOnTouchWidget
refWidget
rippleWidget
rootElementWidget
showTooltipWhenDisabledWidget
tabWidget
tooltipWidget

Scrolling

scrollableWidget

Properties

85

Class hierarchy

isDateTimeField: Boolean= truereadonly
Identifies an object as an instance of DateTimeField class, or subclass thereof.
isDateTimeField: Boolean= truereadonlystatic
Identifies an object as an instance of DateTimeField class, or subclass thereof.
isBadgeBadge
isDelayableDelayable
isEventsEvents
isFieldField
isKeyMapKeyMap
isLabelableLabelable
isLocalizableLocalizable
isRTLRTL
isValidatableValidatable
isWidgetWidget

Other

dateField: DateFieldreadonlyAlso a config

Returns the DateField instance

rendition: outlined | filled | StringAlso a config

Predefined style to use for the field. Possible values are:

  • 'outlined' (default)
  • 'filled'

The supplied value will be part of the field's class list, as b-text-field-{rendition}.

timeField: TimeFieldreadonlyAlso a config

Returns the TimeField instance

$namestaticWidget
catchEventHandlerExceptionsEvents
columnWidget
convertPinchToMousewheelstaticWidget
editableField
inputField
isEmptyField
isEmptyInputField
isValidField
placeholderField
readOnlyField
requiredField
rtlRTL
showRequiredIndicatorField
spanWidget
triggersField
typestaticWidget
valueField

Accessibility

focusVisibleWidget
keyMapKeyMap

CSS

clsWidget

DOM

appendToWidget
contentWidget
contentElementWidget
datasetWidget
elementWidget
focusableElementWidget
focusElementWidget
htmlWidget
idWidget
insertBeforeWidget
insertFirstWidget
overflowElementWidget
styleWidget

Float & align

anchorSizeWidget
maximizeOnMobileWidget
xWidget
yWidget

Layout

alignSelfWidget
flexWidget
heightWidget
marginWidget
maxHeightWidget
maxWidthWidget
minHeightWidget
minWidthWidget
scrollableWidget
widthWidget

Lifecycle

configBase
isConstructingBase
isDestroyedBase
isDestroyingBase

Misc

badgeBadge
callOnFunctionsEvents
cellInfoWidget
disabledWidget
errorTipValidatable
labelLabelable
localeHelperLocalizable
localeManagerLocalizable
refWidget
tabWidget
tooltipWidget

Visibility

hiddenWidget
isVisibleWidget

Widget hierarchy

containsFocusWidget
nextSiblingWidget
ownerWidget
parentWidget
previousSiblingWidget

Functions

64

Configuration

applyDefaultsstaticBase

Events

detachListenersBase

Float & align

alignToWidget
setXYWidget
showByWidget
toFrontWidget

Lifecycle

constructBase
constructorBase
createstaticWidget
destroystaticBase
doDestroyBase
initClassstaticWidget
setConfigBase

Misc

animatePropertyBase
attachTooltipstaticWidget
callbackBase
downloadTestCaseBase
fromElementstaticWidget
fromSelectorstaticWidget
getByIdstaticWidget
isOfTypeNamestaticBase
mixinstaticBase
optionalLstaticLocalizable
resolveCallbackBase
updateLocalizationLocalizable

Other

addListenerEvents
announceAriaLiveWidget
clearField
clearErrorValidatable
composeWidget
createOnFrameDelayable
disableWidget
enableWidget
exitFullscreenWidget
focusWidget
getErrorsValidatable
hasListenerEvents
LstaticLocalizable
maskWidget
onEvents
recomposeWidget
relayAllEvents
removeAllListenersEvents
removeListenerEvents
requestFullscreenWidget
resumeEventsEvents
revertFocusWidget
selectField
setErrorValidatable
suspendEventsEvents
syncInputFieldValueField
triggerEvents
unEvents
unmaskWidget

Visibility

hideWidget
showWidget

Widget hierarchy

closestWidget
containsWidget
eachAncestorWidget
eachWidgetWidget
ownsWidget
queryWidget
queryAllWidget
upWidget

Events

19
actionField
beforeDestroyEvents
beforeHideWidget
beforeShowWidget
catchAllEvents
changeField
clearField
destroyEvents
elementCreatedWidget
focusInWidget
focusOutWidget
hideWidget
inputField
paintWidget
readOnlyWidget
recomposeWidget
resizeWidget
showWidget
triggerField

Event handlers

19

Typedefs

7

CSS variables

37

Inherited

Field12
Widget20
Badge5