A simple and reusable datepicker component for React (Demo)
- Change date format by passing a different date format in the props:
dateFormat: "YYYY/MM/DD"
- Add placeholder text:
placeholderText: 'Click to select a date'
(Defaults to the selected date when no placeholder text is added) - Give users a predefined date range:
minDate: moment()
&maxDate: moment().add(5, 'days')
(this gives users the ability to select a date between today and 5 days in the future) - Set custom moment.js instance (could have defined custom locale settings):
moment: require('./foo/moment')
- Set custom locale settings for locale:
locale: "cs"
- Set date format for callendar:
dateFormatCallendar: "YYYY/MM/DD"
- Set custom weekdays (for locale days):
weekdays: ['Ne', 'Po', 'Út', 'St', 'Čt', 'Pá', 'So']
Installing is really simple and can be done in multiple ways:
- Install with Bower:
bower install react-date-picker
- Install with npm:
npm install react-datepicker --save
- Install with Bundler:
bundle install rails-assets-react-date-picker
- Install Bower
npm install -g bower
- Install Bower Packages
bower install
- Install packages
npm install
- Run
grunt watch
in order to watch for local changes and run tests/build the code. - Start a static webserver
python -m SimpleHTTPServer
- And visit
localhost:8000/example
to see the example.
You can also test server side rendering:
$ node example/node-rendering.js
You should see the HTML returned.
To run tests, simply run npm test
.
Copyright (c) 2014 HackerOne Inc. and individual contributors. Licensed under MIT license, see LICENSE for the full license.