Search code examples
reactjsdatepickermomentjsmaterialize

react-materialize DatePicker allow empty date when init


I am trying to do a frontend component in react with react-materialize.

I have a datePicker to pick up a date but I am struggling to have it init with an empty value.

It shows Invalid Date at startup. It works but might disturb the users so I would like to solve this issue and showing the placeholder instead...

Any help is more than welcome.

Thank you!

Here is the code: CodeSandBox

PS: I am very new to React, I guess the code speaks for itself :-)


Solution

  • You could use the onSelect prop of the DatePicker and pass your date handler function to it. That could look something like this:

    <DatePicker
      onSelect={this.handleBirthdateChange}
      placeholder="Date de naissance"
      // Other props... 
    />
    

    Also remove your value and onChange props from the DatePicker if you choose this approach.