react-native-datepicker icon indicating copy to clipboard operation
react-native-datepicker copied to clipboard

Using 'l', 'L' or slashes in format result in an Invalid Date

Open zedtux opened this issue 6 years ago • 4 comments

Issue

When I change the format prop of DatePicker, following the MomentJS doc, it results in an Invalid Date.

The Moment documentation says we can use l or L in order to get a date like 13/12/2018 but it doesn't. So I tried with DD/MM/YYYY but it fails the same way.

I tried them on the Moment website, using the web console, and it works like a charm, so it's like this component is doing something with the format that Moment doesn't like.

Expected Behavior

Get my date well formatted as described in the Moment documentation.

Code

          <DatePicker
            cancelBtnText={I18n.t(`${I18N_PATH}.buttons.cancel`)}
            confirmBtnText={I18n.t(`${I18N_PATH}.buttons.use_date`)}
            date={this.state.date}
            format="l"
            onDateChange={newDate => this.refresh(newDate)}
            showIcon={false}
          />
        </View>
          <DatePicker
            cancelBtnText={I18n.t(`${I18N_PATH}.buttons.cancel`)}
            confirmBtnText={I18n.t(`${I18N_PATH}.buttons.use_date`)}
            date={this.state.date}
            format="L"
            onDateChange={newDate => this.refresh(newDate)}
            showIcon={false}
          />
        </View>
          <DatePicker
            cancelBtnText={I18n.t(`${I18N_PATH}.buttons.cancel`)}
            confirmBtnText={I18n.t(`${I18N_PATH}.buttons.use_date`)}
            date={this.state.date}
            format="DD/MM/YYYY"
            onDateChange={newDate => this.refresh(newDate)}
            showIcon={false}
          />
        </View>

Environment

  1. react-native -v: 0.57.4
  2. node -v: v11.0.0
  3. npm -v: 6.4.1
  4. yarn --version: 1.12.1
  5. target platform: Android && iOS
  6. operating system: macOS Mojave

zedtux avatar Dec 13 '18 14:12 zedtux

onDateChange send two params, use the second it's work for me:

onDateChange={(dateNotGoog, dateGood) => {
        this.refresh(dateGood)
            }}

lionel95200x avatar Jan 16 '19 13:01 lionel95200x

I just tried it @lionel95200x but I still have displayed Invalid date. 😕

zedtux avatar May 14 '19 10:05 zedtux

onDateChange send two params, use the second it's work for me:

onDateChange={(dateNotGoog, dateGood) => {
        this.refresh(dateGood)
            }}

Saved my day!!!!

esdotzed avatar Jul 31 '19 09:07 esdotzed

still same issue persists. Any solve for it?

vevnkataSukumar avatar Oct 18 '22 02:10 vevnkataSukumar