[DatePicker]

Properties

implementationClassName

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.implementationClassName
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
No
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
Yes
Default value (for prototype ‘standard’)
1
2
DatePicker:
  implementationClassName: TYPO3\CMS\Form\Domain\Model\FormElements\DatePicker
Description
Classname which implements the form element.

properties.containerClassAttribute

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.containerClassAttribute
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
A CSS class which is typically wrapped around the form elements.

properties.elementClassAttribute

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.elementClassAttribute
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
A CSS class written to the form element.

properties.elementErrorClassAttribute

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.elementErrorClassAttribute
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
A CSS class which is written to the form element if validation errors exists.

properties.timeSelectorClassAttribute

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.timeSelectorClassAttribute
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
A CSS class written to the time selector form element.

properties.timeSelectorHourLabel

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.timeSelectorHourLabel
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
The label for the hour selector.

properties.timeSelectorMinuteLabel

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.timeSelectorMinuteLabel
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
The label for the minute selector.

properties.dateFormat

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.dateFormat
Data type
string
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
Yes
Mandatory
Yes
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description

The datepicker time format. The following date formats are allowed:

Day

Format character Description
d Day of the month, two digits with leading zeros
D A textual representation of a day, three letters
j Day of the month without leading zeros
l A full textual representation of the day of the week

Month

Format character Description
F A full textual representation of a month, such as January or March
m Numeric representation of a month, with leading zeros
M A short textual representation of a month, three letters
n Numeric representation of a month, without leading zeros

Year

Format character Description
Y A full numeric representation of a year, four digits
y A two digit representation of a year

properties.enableDatePicker

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.enableDatePicker
Data type
bool
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
No
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
If set to true, an inline javascript will be rendered. This javascript binds the jquery UI datepicker to the formelement.

properties.displayTimeSelector

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.properties.displayTimeSelector
Data type
bool
Needed by
Frontend/ Backend (form editor)
Overwritable within form definition
Yes
form editor can write this property into the form definition (for prototype ‘standard’)
Yes
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  properties:
    containerClassAttribute: input
    elementClassAttribute: 'small form-control'
    elementErrorClassAttribute: error
    timeSelectorClassAttribute: mini
    timeSelectorHourLabel: ''
    timeSelectorMinuteLabel: ''
    dateFormat: Y-m-d
    enableDatePicker: true
    displayTimeSelector: false
Description
If set to true, an additional timeselector will be shown.

formEditor

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor
Data type
array
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
DatePicker:
  formEditor:
    editors:
      100:
        identifier: header
        templateName: Inspector-FormElementHeaderEditor
      200:
        identifier: label
        templateName: Inspector-TextEditor
        label: formEditor.elements.FormElement.editor.label.label
        propertyPath: label
      300:
        identifier: dateFormat
        templateName: Inspector-TextEditor
        label: formEditor.elements.DatePicker.editor.dateFormat.label
        propertyPath: properties.dateFormat
      400:
        identifier: enableDatePicker
        templateName: Inspector-CheckboxEditor
        label: formEditor.elements.DatePicker.editor.enableDatePicker.label
        propertyPath: properties.enableDatePicker
      500:
        identifier: displayTimeSelector
        templateName: Inspector-CheckboxEditor
        label: formEditor.elements.DatePicker.editor.displayTimeSelector.label
        propertyPath: properties.displayTimeSelector
      700:
        identifier: gridColumnViewPortConfiguration
        templateName: Inspector-GridColumnViewPortConfigurationEditor
        label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.label
        configurationOptions:
          viewPorts:
            10:
              viewPortIdentifier: xs
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.xs.label
            20:
              viewPortIdentifier: sm
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.sm.label
            30:
              viewPortIdentifier: md
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.md.label
            40:
              viewPortIdentifier: lg
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.lg.label
          numbersOfColumnsToUse:
            label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.numbersOfColumnsToUse.label
            propertyPath: 'properties.gridColumnClassAutoConfiguration.viewPorts.{@viewPortIdentifier}.numbersOfColumnsToUse'
            fieldExplanationText: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.numbersOfColumnsToUse.fieldExplanationText
      800:
        identifier: requiredValidator
        templateName: Inspector-RequiredValidatorEditor
        label: formEditor.elements.FormElement.editor.requiredValidator.label
        validatorIdentifier: NotEmpty
        propertyPath: properties.fluidAdditionalAttributes.required
        propertyValue: required
      900:
        identifier: validators
        templateName: Inspector-ValidatorsEditor
        label: formEditor.elements.DatePicker.editor.validators.label
        selectOptions:
          10:
            value: ''
            label: formEditor.elements.DatePicker.editor.validators.EmptyValue.label
          20:
            value: DateTime
            label: formEditor.elements.DatePicker.editor.validators.DateTime.label
      9999:
        identifier: removeButton
        templateName: Inspector-RemoveElementEditor
    predefinedDefaults:
      properties:
        dateFormat: Y-m-d
        enableDatePicker: true
        displayTimeSelector: false
    label: formEditor.elements.DatePicker.label
    group: custom
    groupSorting: 200
    iconIdentifier: t3-form-icon-date-picker
    propertyCollections:
      validators:
        10:
          identifier: DateTime
          editors:
            100:
              identifier: header
              templateName: Inspector-CollectionElementHeaderEditor
              label: formEditor.elements.DatePicker.validators.DateTime.editor.header.label
            9999:
              identifier: removeButton
              templateName: Inspector-RemoveElementEditor

formEditor.editors.100

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.100
Data type
array/ [FormElementHeaderEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
DatePicker:
  formEditor:
    editors:
      100:
        identifier: header
        templateName: Inspector-FormElementHeaderEditor

formEditor.editors.200

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.200
Data type
array/ [TextEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
7
8
DatePicker:
  formEditor:
    editors:
      200:
        identifier: label
        templateName: Inspector-TextEditor
        label: formEditor.elements.FormElement.editor.label.label
        propertyPath: label

formEditor.editors.300

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.300
Data type
array/ [TextEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
7
8
DatePicker:
  formEditor:
    editors:
      300:
        identifier: dateFormat
        templateName: Inspector-TextEditor
        label: formEditor.elements.DatePicker.editor.dateFormat.label
        propertyPath: properties.dateFormat

formEditor.editors.400

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.400
Data type
array/ [CheckboxEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
7
8
DatePicker:
  formEditor:
    editors:
      400:
        identifier: enableDatePicker
        templateName: Inspector-CheckboxEditor
        label: formEditor.elements.DatePicker.editor.enableDatePicker.label
        propertyPath: properties.enableDatePicker

formEditor.editors.500

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.AdvancedPassword.formEditor.editors.500
Data type
array/ [CheckboxEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
7
8
AdvancedPassword:
  formEditor:
    editors:
      500:
        identifier: displayTimeSelector
        templateName: Inspector-CheckboxEditor
        label: formEditor.elements.DatePicker.editor.displayTimeSelector.label
        propertyPath: properties.displayTimeSelector

formEditor.editors.700

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.700
Data type
array/ [GridColumnViewPortConfigurationEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
DatePicker:
  formEditor:
    editors:
      700:
        identifier: gridColumnViewPortConfiguration
        templateName: Inspector-GridColumnViewPortConfigurationEditor
        label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.label
        configurationOptions:
          viewPorts:
            10:
              viewPortIdentifier: xs
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.xs.label
            20:
              viewPortIdentifier: sm
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.sm.label
            30:
              viewPortIdentifier: md
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.md.label
            40:
              viewPortIdentifier: lg
              label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.lg.label
          numbersOfColumnsToUse:
            label: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.numbersOfColumnsToUse.label
            propertyPath: 'properties.gridColumnClassAutoConfiguration.viewPorts.{@viewPortIdentifier}.numbersOfColumnsToUse'
            fieldExplanationText: formEditor.elements.FormElement.editor.gridColumnViewPortConfiguration.numbersOfColumnsToUse.fieldExplanationText

formEditor.editors.800

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.800
Data type
array/ [RequiredValidatorEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
DatePicker:
  formEditor:
    editors:
      800:
        identifier: requiredValidator
        templateName: Inspector-RequiredValidatorEditor
        label: formEditor.elements.FormElement.editor.requiredValidator.label
        validatorIdentifier: NotEmpty
        propertyPath: properties.fluidAdditionalAttributes.required
        propertyValue: required

formEditor.editors.900

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.900
Data type
array/ [ValidatorsEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
DatePicker:
  formEditor:
    editors:
      900:
        identifier: validators
        templateName: Inspector-ValidatorsEditor
        label: formEditor.elements.DatePicker.editor.validators.label
        selectOptions:
          10:
            value: ''
            label: formEditor.elements.DatePicker.editor.validators.EmptyValue.label
          20:
            value: DateTime
            label: formEditor.elements.DatePicker.editor.validators.DateTime.label

formEditor.editors.9999

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.editors.9999
Data type
array/ [RemoveElementEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
DatePicker:
  formEditor:
    editors:
      9999:
        identifier: removeButton
        templateName: Inspector-RemoveElementEditor

formEditor.predefinedDefaults

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.predefinedDefaults
Data type
array
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
4
5
6
7
DatePicker:
  formEditor:
    predefinedDefaults:
      properties:
        dateFormat: Y-m-d
        enableDatePicker: true
        displayTimeSelector: false
Description
Defines predefined defaults for form element properties which are prefilled, if the form element is added to a form.

formEditor.propertyCollections.validators.10

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.propertyCollections.validators.10
Data type
array
Needed by
Backend (form editor)
Mandatory
No
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
DatePicker:
  formEditor:
    propertyCollections:
      validators:
        10:
          identifier: DateTime
          editors:
            100:
              identifier: header
              templateName: Inspector-CollectionElementHeaderEditor
              label: formEditor.elements.DatePicker.validators.DateTime.editor.header.label
            9999:
              identifier: removeButton
              templateName: Inspector-RemoveElementEditor

formEditor.propertyCollections.validators.10.identifier

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.propertyCollections.validators.10.identifier
Data type
string
Needed by
Backend (form editor)
Mandatory
Yes
Default value (for prototype ‘standard’)
1
2
3
4
5
6
DatePicker:
  formEditor:
    propertyCollections:
      validators:
        10:
          identifier: DateTime
Good to know
Description
Identifies the validator which should be attached to the form element. Must be equal to a existing <validatorIdentifier>.

formEditor.propertyCollections.validators.10.editors.100

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.propertyCollections.validators.10.editors.100
Data type
array/ [CollectionElementHeaderEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
DatePicker:
  formEditor:
    propertyCollections:
      validators:
        10:
          identifier: DateTime
          editors:
            100:
              identifier: header
              templateName: Inspector-CollectionElementHeaderEditor
              label: formEditor.elements.DatePicker.validators.DateTime.editor.header.label

formEditor.propertyCollections.validators.10.editors.9999

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.propertyCollections.validators.10.editors.9999
Data type
array/ [RemoveElementEditor]
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
DatePicker:
  formEditor:
    propertyCollections:
      validators:
        10:
          identifier: DateTime
          editors:
            9999:
              identifier: removeButton
              templateName: Inspector-RemoveElementEditor

formEditor.label

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.label
Data type
string
Needed by
Backend (form editor)
Mandatory
Yes
Default value (for prototype ‘standard’)
1
2
3
DatePicker:
  formEditor:
    label: formEditor.elements.DatePicker.label
Good to know
Description
This label will be shown within the “new element” Modal.

formEditor.group

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.group
Data type
string
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
DatePicker:
  formEditor:
    group: custom
Default value
Depends (see concrete element configuration)
Description
Define within which group within the form editor “new Element” modal the form element should be shown. The group value must be equal to an array key within formElementGroups.

formEditor.groupSorting

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.groupSorting
Data type
int
Needed by
Backend (form editor)
Mandatory
Recommended
Default value (for prototype ‘standard’)
1
2
3
DatePicker:
  formEditor:
    groupSorting: 200
Description
The position within the formEditor.group for this form element.

formEditor.iconIdentifier

Option path
TYPO3.CMS.Form.prototypes.<prototypeIdentifier>.formElementsDefinition.DatePicker.formEditor.iconIdentifier
Data type
string
Needed by
Backend (form editor)
Mandatory
Yes
Default value (for prototype ‘standard’)
1
2
3
DatePicker:
  formEditor:
    iconIdentifier: t3-form-icon-date-picker
Description

An icon identifier which must be registered through the \TYPO3\CMS\Core\Imaging\IconRegistry. This icon will be shown within