Explicit undefined in input value prop

by Leigh Brenecki

HTML

<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
<p>
Open Developer Tools and start typing in the field below:
</p>
<div id='react'>
</div>

Babel + JSX

class MyForm extends React.Component {
    constructor(props) {
        super(props);
        this.state = {name: undefined}
    }

    render() {
        return (
            <form className="add-support-staff-form">
                <input name="name" type="text" value={this.state.name} onChange={this.onFieldChange('name').bind(this)}/>
            </form>
        )
    }

    onFieldChange(fieldName) {
        return function (event) {
            this.setState({[fieldName]: event.target.value});
        }
    }
}

ReactDOM.render(<MyForm />, document.getElementById('react'))