title: Reactjs form with multiple inputs and state change
body: <p>I am trying to build a ReactJS form to accept multiple input from the user and display it in an alert box. I am unable to display my data after the user has entered it.</p>
  
  <p>**</p>
  
  <pre><code>import React,{Component} from 'react'
  class Multiselect extends Component{
      constructor(props){
          super(props);
          this.state={ employee:'', fruit:'Apple'};
          this.handleChange= this.handleChange.bind(this);
          this.handleSubmit= this.handleSubmit.bind(this);
      }
      handleChange(event){
          this.setState({
      employee: event.target.empname,fruit:event.target.fruit});
      }
      handleSubmit(event){
          alert('Employee name is' +this.state.empname +"fruit selected is "+ this.state.fruit);
          event.preventDefault();
      }
      render(){
          return(
              &lt;form onSubmit={this.handleSubmit}&gt;
                  &lt;label&gt;Name
                      &lt;input type="text" empname={this.state.empname} onChange={this.handleChange}/&gt;
                  &lt;/label&gt;
                  &lt;select fruit={this.state.fruit} onChange={this.handleChange}&gt;
                      &lt;option fruit="Apple"&gt;Apple&lt;/option&gt;
                      &lt;option fruit="Mango"&gt;Mango&lt;/option&gt;
                      &lt;option fruit="Guava"&gt;Guava&lt;/option&gt;
                      &lt;option fruit="Orange"&gt;Orange&lt;/option&gt;
                  &lt;/select&gt;
                  &lt;input type="Submit" value="Submit"/&gt;
              &lt;/form&gt;
          )
      }
  }
  export default Multiselect
  </code></pre>
  
  <p>**</p>