onChange function is not triggered on React 15.x

[kleberpinel]

Hello @wojtekmaj

I am using your library in a pretty vanila way, but the call back onChange is never called when I select something a date in my calendar. Take a look:

Any idea? My version in my package.json is "react-calendar": "^2.13.0"

[sgnl]

Curious as to what the errors above the "rendering" log?

[sgnl]

Try these and see if one of them helps you:

change your changeSelectedDate to this syntax (instead of the arrow syntax):

 	changeSelectedDate(date) {
		// your console log here
	}

or...

onChange={() => this.changeSelectedDate}

or ...

Keeping the code the same but in your constructor bind your method to the instance, aka: this.changeSelectedDate = this.changeSelectedDate.bind(this)

[kleberpinel]

Hey @sgnl, I just tried all of them, none looks to be working.

the rendering log is just to show that is passing through that code and is rendering the component.

Any other suggestion ?

[sgnl]

Could you post up the example on https://codesandbox.io/ ?

I see that the docs have similar code but thanks for trying my suggestions anyway 👍

[sgnl]

This seems to work: https://codesandbox.io/s/l96wjl78mm

and so does this: https://codesandbox.io/s/l194xo9mq

Do you have any other events on the page? Or what does the other files look like? If you can, try to reproduce it in codesandbox

[jdebarochez]

I had the same issue. Updating my React dependencies solved the issue. However, I do not explain why it didn't work in the first place.

Thanks @sgnl for the links. It helped found the differences.

[wojtekmaj]

Hmmm. There were no breaking changes between React 15.x and 16.x in our case as React did not throw any warnings.

Is the sample I wrote working for you? If not, are there any errors? What do they say? If the sample works, check the differences please! Maybe there's something hard to see for an eye (Babel doing some magic?). React version really shouldn't mattter as long as it's >=15.5.

[kleberpinel]

The react version in my project is 15.4.2.. you just said that it should work do >= 15.5.0 .... Have you tested before for this version (15.4.2) ? I forked you project, ran yarn and yarn start from the sample project and I'm getting react-calendar/sample/Sample.jsx:3:21: Cannot resolve dependency 'react-calendar'

[wojtekmaj]

I did not test it in earlier versions and I don't think they will ever be supported. 15.5 is, at the moment, the oldest version that has a lot in common with the newest versions, mostly because of PropTypes.

The error says something else though. Most likely you will need to adjust package.json to include react-calendar from npm, not from ../ as it is there. Try writing "react-calendar": "latest" instead!

[kleberpinel]

Hey @wojtekmaj thanks for your support but I had to do an work around with tileContent...

<div
  className="click-event-day"
  onClick={this.changeSelectedDate}
  data-day={formatedDate} />

and

changeSelectedDate = (event) => {
  const day = event.target.dataset.day
  const selectedDate = moment(day, 'YYYY-MM-DD').toDate()
  this.props.changeSelectedDate(selectedDate)
}

It might not be the correct lib solution, but works :) ... If I have time, I'll try to investigate better why its not working the trigger

[yummyelin]

Same issue here.
Change to using 'onClick', 'onClickDay', still not working.

"react": "^15.5.0",
"react-calendar": "^2.13.1",