In android onDateChange event is not fired when we select minimum / current date

[Dsudhirkumar]

Describe the bug In Android onDateChange event not fired

Expected behavior onDateChange event need to fire on current date or minimum date.

To Reproduce Add example code that reproduces the behavior.

export default class App extends Component {

  state = { date: new Date() }

  render = () =>
   <DatePicker
            date={this.state.date}
            onDateChange={(date) => this.setState({ date: date })}
            mode={'date'}
            locale={I18nManager.isRTL ? 'ar-LY' : 'en-IN'}
            minimumDate={new Date()}
            maximumDate={this.props.maxdate}
            style={style.datePickerStyle}
          /> 

}

Smartphone (please complete the following information):

• OS: [Android or iOS]
• React Native version [e.g. 0.59.4]
• react-native-date-picker version [e.g. 2.5.1]

[henninghall]

Didn't manage to reproduce this, what version of react native and react native date picker are you using?

[Ivan-Martynenka]

I have the same issue, if for example i set minimum date at 12.30 the date picker doesn't allow me to select the 12.05-12.30 time, but allow to select 12.00, at this action prop onDateChange doesn't change date. And when render set time at 12.00. This problem appear with any time. Time picker always set xx.00 time as default ignore the minimum date prop. I face this issue on android

[Dsudhirkumar]

Didn't manage to reproduce this, what version of react native and react native date picker are you using?

Hi hennighall thanks for replying
i am using "react-native-date-picker": "^3.3.0" and "react-native": "0.64.2",

[ashirkhan94]

same issue for me in android I am using "react-native-date-picker": "^4.2.2", and tried the latest version (4.2.5), and it also has this issue In My case The selected date is the past date and if we scroll to the current date the onDateChange event not firing, but this scenario works in ios

[vishalSharmaCfcs]

**Try to use This code** 
import DateTimePickerModal from 'react-native-modal-datetime-picker';
const App()=>{
 const [isDatePickerVisible, setDatePickerVisibility] =useState(false);
 const [date, setDate] = useState();
 const showDatePicker = () => {
    setDatePickerVisibility(true);
};
const hideDatePicker = () => {
  setDatePickerVisibility(false);
};
const handleConfirm = data => {
   setDate(data.toLocaleDateString());
   hideDatePicker();
};
return(
**<DateTimePickerModal
     isVisible={isDatePickerVisible}
     mode="date"
     onConfirm={handleConfirm}
     onCancel={hideDatePicker}
  />
)
}

[Ivan-Martynenka]

Maybe this will help someone who uses minuteInterval My problem was solved by rounding the date, minimumDate and maximumDate to number that equals minuteInterval After rounding everything started working as it should.

[henninghall]

The latest version includes fixes for minuteInterval and min/max dates. Please try that one if anyone is still having issues with this.

[EquesMedia]

Hi, i know this is closed, but I had the issue with a 15 minutes interval and I figured I'd share my solution with some explanation for the next Googler.

Basically, onDateChange was not triggered if I scrolled to the minDate.

Solution has been given by @Ivan-Martynenka. Gotta make sure that the minimumDate that is passed is rounded exactly to the millisecond to fit the minuteInterval.

Here is my utility function to make sure it's the case. I used date-fns to set the minutes/seconds/milliseconds etc. It fits my business logic, but feel free to adapt.

static getDateHourQuarter(date: Date, roundNextQuarter?: boolean): Date {
    const minutes = date.getMinutes();

    let formattedDate = new Date(date);

    if (!roundNextQuarter) {
      if (minutes >= 0 && minutes < 15) formattedDate = setMinutes(date, 0);
      if (minutes >= 15 && minutes < 30) formattedDate = setMinutes(date, 15);
      if (minutes >= 30 && minutes < 45) formattedDate = setMinutes(date, 30);
      if (minutes >= 45 && minutes < 59) formattedDate = setMinutes(date, 45);
    } else if (nextQuarter) {
      if (minutes >= 0 && minutes < 15) formattedDate = setMinutes(date, 15);
      if (minutes >= 15 && minutes < 30) formattedDate = setMinutes(date, 30);
      if (minutes >= 30 && minutes < 45) formattedDate = setMinutes(date, 45);
      if (minutes >= 45 && minutes < 59) formattedDate = setHours(setMinutes(date, 0), 1);
    }

    return setSeconds(setMilliseconds(formattedDate, 0), 0);
  }

I wrapped my minimumDate with the function:

const minDate = new Date();

<DatePicker
  {...props}
   minimumDate={getDateHourQuarter(minDate)}
/>

Selecting the minimum date should trigger the onDateChange function after implementing the code above.

Thanks for maintaining this package.