diff --git a/src/components/DatePicker/index.js b/src/components/DatePicker/index.js index 393ba1b34bc7..5d1d8442bf6d 100644 --- a/src/components/DatePicker/index.js +++ b/src/components/DatePicker/index.js @@ -19,8 +19,6 @@ class DatePicker extends React.Component { this.setDate = this.setDate.bind(this); this.showDatepicker = this.showDatepicker.bind(this); - - this.defaultValue = props.defaultValue ? moment(props.defaultValue).format(CONST.DATE.MOMENT_FORMAT_STRING) : ''; } componentDidMount() { @@ -75,7 +73,6 @@ class DatePicker extends React.Component { label={this.props.label} onInputChange={this.setDate} value={this.props.value} - defaultValue={this.defaultValue} placeholder={this.props.placeholder} errorText={this.props.errorText} containerStyles={this.props.containerStyles} diff --git a/src/components/Form.js b/src/components/Form.js index c643ece0ba88..b82ff957a25f 100644 --- a/src/components/Form.js +++ b/src/components/Form.js @@ -251,7 +251,7 @@ function Form(props) { // We want to initialize the input value if it's undefined if (_.isUndefined(inputValues[inputID])) { - inputValues[inputID] = defaultValue; + inputValues[inputID] = defaultValue || ''; } // We force the form to set the input value from the defaultValue props if there is a saved valid value @@ -283,6 +283,9 @@ function Form(props) { } }, value: inputValues[inputID], + // As the text input is controlled, we never set the defaultValue prop + // as this is already happening by the value prop. + defaultValue: undefined, errorText: errors[inputID] || fieldErrorMessage, onBlur: (event) => { // We delay the validation in order to prevent Checkbox loss of focus when diff --git a/src/components/NewDatePicker/index.js b/src/components/NewDatePicker/index.js index b5dad7992bfb..ace4e2285309 100644 --- a/src/components/NewDatePicker/index.js +++ b/src/components/NewDatePicker/index.js @@ -49,11 +49,6 @@ class NewDatePicker extends React.Component { }; this.setDate = this.setDate.bind(this); - - // We're using uncontrolled input otherwise it won't be possible to - // raise change events with a date value - each change will produce a date - // and make us reset the text input - this.defaultValue = props.defaultValue ? moment(props.defaultValue).format(CONST.DATE.MOMENT_FORMAT_STRING) : ''; } /** @@ -76,7 +71,6 @@ class NewDatePicker extends React.Component { icon={Expensicons.Calendar} label={this.props.label} value={this.props.value || ''} - defaultValue={this.defaultValue} placeholder={this.props.placeholder || this.props.translate('common.dateFormat')} errorText={this.props.errorText} containerStyles={this.props.containerStyles}