Version:

Install ​

shell
npm i @vaadin/date-time-picker

Import ​

javascript
import '@vaadin/date-time-picker';

Variants ​

Default ​

html
<vaadin-date-time-picker label="Zeitpunkt"></vaadin-date-time-picker>
javascript
document.querySelector('vaadin-date-time-picker').value = '2020-06-12T12:30';

Read Only ​

html
<vaadin-date-time-picker label="Nur lesen" readonly></vaadin-date-time-picker>
javascript
document.querySelector('vaadin-date-time-picker').value = '2020-06-12T12:30';

Disabled ​

html
<vaadin-date-time-picker label="Inaktiv" disabled></vaadin-date-time-picker>
javascript
document.querySelector('vaadin-date-time-picker').value = '2020-06-12T12:30';

Invalid ​

html
<vaadin-date-time-picker label="Ungültig" invalid></vaadin-date-time-picker>
javascript
document.querySelector('vaadin-date-time-picker').value = '2020-06-12T12:30';
document.querySelector('vaadin-date-time-picker').errorMessage = 'Bitte ein gültiges Datum eingeben.';