React Component as Const select onChange passing selected value

Question

I have a react component created as a const and with props.

I also have a function see: selectChanged() {} is another file which is returning undefined when I change the select value.

Here is the component code:

... 

const myComponent = (props) => <div id="myid">
    <form onSubmit={props.onSubmit} className="gs-form">

        <div className="label">MySelect</div>
            <select
                id="myselect"
                value=""
                onChange={props.selectChanged}>
                <option value="one" defaultValue>one</option>
                <option value="two">two</option>
                <option value="three">three</option>
            </select>
        </div>
    </form>
</div>;

export default myComponent;

And the data is passed to this:

selectChanged(value) {

    console.info(value);

}

The problem is that it keeps showing undefined what I change the select value.

How can I fix this so that 'selectChanged' passes the value of the selected select ?

its because of this: value="", either remove it, or use a variable and update that in onChange function, like this: value={props.selectedValue} — Mayank Shukla
– Mayank Shukla, Commented Nov 23, 2018 at 15:56

Monica Acha · Accepted Answer · 2018-11-23 16:02:46Z

1

change= (event) => {
         this.props({selectChanged: event.target.value});
     }
...


<select
    id="myselect"
    value={this.props.selectChanged}
    onChange={this.change}>
    <option value="one" defaultValue>one</option>
    <option value="two">two</option
    <option value="three">three</option>
</select>

answered Nov 23, 2018 at 16:02

Monica Acha

1,0869 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React Component as Const select onChange passing selected value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related