Skip to main content
Version: 9.4

DatePicker

<div id="pg_date" 
data-win-control="HFWinJSCtrl.DatePicker"
data-win-options="{
defaultValue: 'now',
required: true,
label: 'Date',
emptyContent : 'Select...',
list: true
}">
</div>
PropertyTypeHow to useDescription
convertToLocalDateBooleanconvertToLocalDate: trueIf set to true, the selected date is converted to the local date of the device. Default is false
defaultValueString/FunctiondefaultValue: 'now'Use the value "now" to offer the current ('local') date. A custom code function can be used to set defaultValue.
disabledBooleandisabled: trueSet "true" whenever the DatePicker should be disabled. The default value is false.
disableCalendarBooleandisableCalendar: trueSet "true" whenever the DatePicker control calendar flyout should be disabled. The default value is false.
displayValueFormatdisplayValueFormat: 'dd.MM.yyyy'To change the format of the displayed date. For more information visit: https://docs.telerik.com/kendo-ui/framework/globalization/dateformatting.
doNotCopyBooleandoNotCopy: trueSet "true" whenever the field should get deleted if form is copied.
emptyContentStringemptyContent: 'Select ...'Write a short word to indicate that the appropriate date can/must be chosen.
labelStringlabel: 'Date'Define a label for your control element.
listBooleanlist: trueSet this property to "true" if data connected with this control should be a sorting/filtering/grouping option on the listpage, is used in template objects (eg. the listTemplate) or it should show up in admin ui listings.
listOptionsObjectlistOptions: {...}Set additional options for controls with list equals true. E.g. set custom label for filter/sort/group dialogs or hide them complettely.
mappingBooleanmapping: trueSet "true" whenever the form element should be visible / editable in the corresponding SharePoint list.
maxStringmax: 'now'Set to allow entries up to until this date. With "now" the newest possible entry is the current day. Format for fixed dates is yyyy-MM-dd
minStringmin: '1965-05-14'Set to allow entries from that date on. Format is yyyy-MM-dd and default value is 01.01.1900
mobilePickerBooleanmobilePicker: trueUse native date picker on mobile devices. There are settings restrictions e.g. formatting or start interval.
parseFormatsString-ArrayparseFormats: ['ddMMyyyy', 'dd/MM/yyyy', 'dd-MM-yyyy']Used to give the user several format options to type in the date. "Converts" the date to format which is set with displayValueFormat.
persistentStringpersistent: 'user'The value "user" sets the initial value of the DatePicker to the value of the previous form item of the current user and overwrites any defaultValue.
startStringstart: 'decade'Used to control with which area the DatePicker view starts when opened. Allowed values: month / year / decade / century
requiredBooleanrequired: trueSet "true" if the control has to be filled in.
tooltipStringtooltip: 'Please indicate at least one cause of damage.'Write a comment to provide further information about the field. A question mark will then be shown within the label and with a click/tap on it, the information will occur.
visitingBooleanvisiting: trueSet "true" whenever the form element should be marked as "visited" when the user has clicked or tapped at the form field.
onChangedFunction(value: Date)onChanged: HFFormdefinition.Namespace.MethodCall a pre-defined JS-method to do something when the status of the control changes

listOptions Object

PropertyTypeHow to useDescription
dialogTextStringdialogText: 'Display Text'Set custom label for filter/sort/group dialogs.
dialogHideBooleandialogHide: trueHide field from filter/sort/group dialogs.

Stored data

<div id="pg_date" data-win-control="HFWinJSCtrl.DatePicker" data-win-options="{
required: true,
emptyContent : 'Select...' }">
</div>

For each DatePicker inside your forms there is one value pair of stored data. Date format according ISO 8601

{
"id": "pg_date",
"value": "2021-07-15T22:00:00.000Z"
}
{
"id": "pg_date_HFDate",
"value": "16. Jul. 2021"
}
{
"id": "pg_date_HFLocal",
"value": "2021-07-16T00:00:00.000+02:00"
}