diff --git a/docs/src/app/components/pages/components/DatePicker/ExampleSimple.jsx b/docs/src/app/components/pages/components/DatePicker/ExampleSimple.jsx
index 27bf7e9bda09fd..11750e34b036cb 100644
--- a/docs/src/app/components/pages/components/DatePicker/ExampleSimple.jsx
+++ b/docs/src/app/components/pages/components/DatePicker/ExampleSimple.jsx
@@ -5,6 +5,7 @@ const DatePickerExampleSimple = () => (
+
);
diff --git a/docs/src/app/components/pages/components/DatePicker/Page.jsx b/docs/src/app/components/pages/components/DatePicker/Page.jsx
index c6facbbf2fdd25..52dd9cc8a60ff2 100644
--- a/docs/src/app/components/pages/components/DatePicker/Page.jsx
+++ b/docs/src/app/components/pages/components/DatePicker/Page.jsx
@@ -17,7 +17,8 @@ import datePickerExampleInternationalCode from '!raw!./ExampleInternational';
import datePickerReadmeText from './README';
const descriptions = {
- simple: 'The Date Picker defaults to a portrait dialog. The `mode` property can be set to `landscape`.',
+ simple: 'The Date Picker defaults to a portrait dialog. The `mode` property can be set to `landscape`. You can ' +
+ 'also disable the Dialog passing `true` to the `disabled` property.',
inline: 'Inline Date Pickers are displayed below the input, rather than as a modal dialog. ',
ranged: 'This example allows you to set a date range, and to toggle `autoOk`, and `disableYearSelection`.',
controlled: '`DatePicker` can be implemented as a controlled input, where `value` is handled by state in the ' +
diff --git a/src/date-picker/date-picker.jsx b/src/date-picker/date-picker.jsx
index 46562797562142..fd87a820d71af5 100644
--- a/src/date-picker/date-picker.jsx
+++ b/src/date-picker/date-picker.jsx
@@ -41,6 +41,11 @@ const DatePicker = React.createClass({
*/
disableYearSelection: React.PropTypes.bool,
+ /**
+ * Disables the DatePicker.
+ */
+ disabled: React.PropTypes.bool,
+
/**
* Used to change the first day of week. It drastically varies from
* Saturday to Monday (could even be Friday) between different locales.
@@ -165,6 +170,7 @@ const DatePicker = React.createClass({
disableYearSelection: false,
style: {},
firstDayOfWeek: 0,
+ disabled: false,
};
},
@@ -248,9 +254,10 @@ const DatePicker = React.createClass({
_handleInputTouchTap: function _handleInputTouchTap(event) {
if (this.props.onTouchTap) this.props.onTouchTap(event);
- setTimeout(() => {
- this.openDialog();
- }, 0);
+ if (!this.props.disabled)
+ setTimeout(() => {
+ this.openDialog();
+ }, 0);
},
_handleWindowKeyUp() {