JedWatson / react-select

The Select Component for React.js
https://react-select.com/
MIT License
27.63k stars 4.13k forks source link

Unable to get access to the event object #1299

Closed lingpri closed 8 years ago

lingpri commented 8 years ago

How do I get access to the event object when the OnChange() method fires. I would like the target name when the event is fired.

I can do this below: handleChange (value) { this.props.updateAreaValue(value); }

Instead I need this:

handleChange (value,event) { this.props.updateAreaValue(value,event); }

MarkLeMerise commented 8 years ago

Hi @lingpri, I was wondering if you could expand a bit more on your use case and why you need the event object?

a6hi5h3k commented 8 years ago

@MarkLeMerise One usecase as per me would be, to peek into event object and check value of metaKey/altKey flag. This can come handy to figure out if Cmd/Ctrl/Alt key was pressed at the time of selecting an option, which can lead to some special handling.

lingpri commented 8 years ago

@MarkLeMerise : I dynamically generate react-select tags by reading a json select tags. If I can get the event object, I can see which element was changed and alter my state based on the selection. This would help me eliminate lot of boiler plate code I would have to write for the change handlers. The HTML5 select tag does provide the event object for the change handler and I think it would come in handy.

MarkLeMerise commented 8 years ago

@lingpri You might try passing a name to your onChange handler if you need to know which instance changed:

var views = jsonData.map(obj => <Select name={ obj.name } onChange={ value => handleChange(value, obj.name) } />);

As I did in the example, you can pass a name prop to a <Select> and that'll be the name of the underlying hidden <input>.

In that way, react-select is different from a native <select>. As a higher-order component, react-select abstracts the DOM away from you, so you usually shouldn't need to know an event's DOM source.

lingpri commented 8 years ago

@MarkLeMerise - Thanks for the pointer. closing the issue.

sslgeorge commented 7 years ago

This issue should not be closed, I think it is a real issue that the application is not able to access the event object, there are hundreds of cases when I will want to take a look at the event object. Without the event object it means my select component will need a different handler from my regular input elements, which in my humble opinion does not make sense.

daggmano commented 6 years ago

Unless anyone knows differently, it seems that usage of react-select with formik would require access to the event object.

elramus commented 5 years ago

@daggmano Yup, coming to that conclusion as well. Would love it if these two could play nice together.