React Datetimepicker

A simple date and time picker for React

Basic Datepicker

Nothing special here...


    var DatePicker = require("react-datetimepicker");         

    ReactDOM.render(<DatePicker  />, document.getElementById("content"));
    

Range Datepicker

Setting isRange to true provides two connected pickers.


    var DatePicker = require("react-datetimepicker");         

    ReactDOM.render(<DatePicker isRange={true}  />, document.getElementById("content"));
    

Timepicking

Setting timeEnabled to true provides a timepicker at the bottom and reformats the output.


    var DatePicker = require("react-datetimepicker");         

    ReactDOM.render(<DatePicker enableTime={true}  />, document.getElementById("content"));
    

minDate, maxDate and defaultDate

minDate and maxDate provide selection boundaries for both single and range pickers. defaultDate allows you to specify the starting date. Otherwise the datepickers will begin on today.


    var DatePicker = require("react-datetimepicker");         

    ReactDOM.render(<DatePicker defaultDate={moment("10/31/2015", "MM/DD/YYYY")} 
                        minDate={moment("10/21/2015", "MM/DD/YYYY")} 
                        maxDate={moment("11/21/2015", "MM/DD/YYYY")}  />, document.getElementById("content"));