DateInput Overview

The DateInput represents an input field that recognizes and formats scheduling values such as dates.

Basic Usage

The following example demonstrates the DateInput in action.

class App extends React.Component {
    state = { value: new Date() };

    render() {
        return (
            <div>
               <DateInput
                    value={this.state.value}
                    onChange={this.changeDate}
                />
            </div>
        );
    }

    changeDate = (event) => {
        this.setState({ value: event.value });
    }
}

ReactDOM.render(
    <App />,
    document.querySelector('my-app')
);

Functionality and Features

• Disabled state
• Spin buttons
• Incremental steps
• Date ranges
• Formats
• Placeholders
• Keyboard navigation
• Accessibility

Suggested Links

• API Reference of the DateInput
• Globalization of the DateInputs