MDBDatePicker

Topic: MDBDatePicker

fbischoff free asked 5 years ago

Hi all,

Is there a bug with the MDBDatePicker ?

If I define a mdbdatepicker like this :

MDBDatePicker clearable={true} clearLabel={uiElements.clear} value={this.state.publishDate} getValue={this.getPublishDate}

And I tap on the clear button, nothing happened :( I expect to have my value cleared

But If I define the MDBDatePicker like this :

MDBDatePicker clearable={true} clearLabel={uiElements.clear} getValue={this.getPublishDate}

And if I tap on the clear button, date clears as expected. But I lose the capability to set the stored date if needed

Add comment

Anna Morawska staff answered 5 years ago

0 0 Best answer

Please insert min. 20 characters.

Hi @fbischoff,

you don't have to set value prop. Try to use the component like this:

import React, { Component } from "react";
import { MDBContainer, MDBDatePicker, } from "mdbreact";

class Support extends Component {

  state = {
    publishDate: new Date()
  }

  getPublishDate = value => {
    this.setState({
      publishDate: value
    })
  }

  render() {
    const uiElements = {
      clear: 'Custom'
    }

    return (
      <MDBContainer>
        <p>Publish Date : {this.state.publishDate ? this.state.publishDate.toString() : "Not set"}</p>
        <MDBDatePicker clearable={true} clearLabel={uiElements.clear} getValue={this.getPublishDate} />
      </MDBContainer>
    );
  }
}

export default Support;

fbischoff free commented 5 years ago

Hi @Anna Morawska I see.But my problem is : I have a list of music titles. Each title has a name and a date of production.If I select one title I need to set this date of production Inside the datepicker and at this time it seems to be impossible because if I set the date into the datepicker I lose the capability to clear it.

How can I achieve such thing ?

I need to clear the date but I need to be able to set the date too

Anna Morawska staff commented 5 years ago

Unfortunately, it is impossible to use at the same time clearable, and controlled Datepicker. One option which I see is to define a clear button outside the Datepicker interface and attached to it your own logic.

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB React
MDB Version: 4.13.0
Device: Computer
Browser: Internet Explorer, Chrome
OS: Windows 10
Provided sample code: No
Provided link: No

fbischoff

15Support score
3Questions 0Answers 0Snippets