• Forms
  • Date and Range Picker
Date and Time Picker
Documentation: https://www.npmjs.com/package/react-flatpickr
Basic
Date Time
Use {enableTime: true, dateFormat: 'Y-m-d H:i'} option to enable time support
Range Calendar
Use {mode: 'range'} select the date with range.
Preloading Time
Use {noCalendar: true, enableTime: true, dateFormat: 'H:i'} with Date Time options to disable calendar and show time picker only.
Javascript Range Slider
Postion : Top-Left
0%
Postion : Top-right
0%
Postion : Bottom-Left
0%
Postion : Bottom-right
0%
noUI Slider
Documentation: https://www.npmjs.com/package/nouislider-react
Using HTML5 input elements
Non linear slider
500.005%
4000.0040%
Locking sliders together
Value: 40
Value: 40

© 2024. KGT rights reserved.