The React DateTime includes a calendar component and a time input component and allows the user to pick a date and/or time. The DateTime, also called DateTimeInput, can be used in all cases when there is a need to pick or input time and date. The date can be choseen by clicking on the calendar button and selecting the date from the calendar, or it can be typed manually in the input text field. By clicking the clock button you can chose the time with the help of the clock counters or enter it by hand in the time input text field.
React DateTime basic capabilities
Localization in different languages and time formats is one of the basic capabilities of our React DateTime component. Text files with corresponding language codes contain the different localizations. They are set to the DateTime instance by the culture property.
In addition the DateTime can be configured to be only date picker, only time picker or both. To set this configuration you will have to use the formatString property.<
Our React DateTime has a built-in date parsing capability. The supported formats for choosing a date are: short date, long date, short time, long time, long date and short time, long date and long time and month/day.
There also exists different built-in template options for displaying the calendar and clock buttons.
React DateTime advanced capabilities
Range selection is one of our DateTime advanced capabilities. Using this feature from the calendar you can click on a start date and on an end date and thus choose a range.
In addition the horizontal alignment of the calendar and clock component can be changed to left and right and also the vertical alignment to top and bottom.
Our DateTime supports animation. By enabling the animation you can see a nice fading effect when the calendar appears or disappears.
Keyboard navigation and right to left layout are also available.