title: React - differentiating between dynamically generated inputs on a form
body: <p>I have an input form for data in a table that generates inputs in accordance to how many columns there are. I am struggling to separate the inputs however so that when I change a value in one all of the inputs change. Is there any way that I can differentiate between them so that I can input different values in each input. I am using React with flux.</p>
  
  <p>Here is the code I am currently working with:</p>
  
  <pre><code>import React from 'react';
  import AppStore from '../../stores/AppStore';
  
  export default class RowForm extends React.Component {
      state = {input: ''};
      onChange = (e) =&gt; {
          this.setState({input: e.target.value});
          console.log(input);
      };
  
      editStop = () =&gt; {
          this.props.editStop();
      };
  
      handleSubmit = (e) =&gt; {
          e.preventDefault();
  
          let access_token = AppStore.getToken();
          let id = AppStore.getTable().id;
  
          this.props.handleSubmit(access_token, id);
  
      };
  
      render() {
  
          let {input} = this.state;
          let dataEntries = AppStore.getTable().columns; //this gets the amount of columns so I can map through them and generate the correct amount of inputs.
  
          return (
              &lt;tr&gt;
                  {dataEntries.map((element, index) =&gt; {
                      return (
                          &lt;td key={index}&gt;&lt;input type="text" className="form-control" id={element.id} placeholder="enter data" value={this.state.input} onChange={this.onChange} /&gt;&lt;/td&gt;
                      );
                  })}
                  &lt;td&gt;
                      &lt;button className="btn btn-default" onClick={this.editStop}&gt;&lt;i className="fa fa-ban"&gt;&lt;/i&gt;Cancel&lt;/button&gt;
                      &lt;button className="btn btn-success" onClick={this.handleSubmit}&gt;&lt;i className="fa fa-check"&gt;&lt;/i&gt;Save&lt;/button&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          );
      }
  } 
  </code></pre>
  
  <p>Any help would be much appreciated, especially examples!</p>
  
  <p>Thanks for your time</p>