title: How to find the index in button to modal Reactjs
body: <p>so im having Difficulty on passing the index from button to button so here is my code 
  the first one is the render loop that shows all my rows and its button the button at the delete part is calling the index from the row</p>
  
  <pre><code>    renderItem(d, i) {
    return &lt;tr key={i} &gt;
      &lt;td&gt; {d.Employee_ID} &lt;/td&gt;
      &lt;td&gt;{d.Employee_Name}&lt;/td&gt;
      &lt;td&gt;{d.Address }&lt;/td&gt; 
      &lt;td&gt;&lt;center&gt;&lt;button className ="btn btn-info" onClick={this.handleOnclick.bind(this,  d.Employee_ID, d.Employee_Name, d.Address , d.Department)}   data-toggle="modal" data-target="#UpdateEmployee"&gt;Edit&lt;/button&gt;&lt;/center&gt;&lt;/td&gt;
      &lt;td&gt;&lt;center&gt;&lt;button className ='btn btn-danger'  onClick={this.handleOnclick.bind(this,  d.Employee_ID , d.Employee_Name,i)} data-toggle="modal" data-target="#DeleteEmployee"&gt; Delete&lt;/button&gt;&lt;/center&gt;&lt;/td&gt;
  
  
           &lt;/tr&gt;
  }
  </code></pre>
  
  <p>this is where it proceed to my modal </p>
  
  <pre><code> {/*Delete*/}
             &lt;div className="modal fade" id="DeleteEmployee" role="dialog"&gt;
             &lt;div className="modal-dialog"&gt;
               &lt;div className="modal-content"&gt;
                  &lt;div className="modal-header"&gt;
                    &lt;button type="button" className="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;
                    &lt;h4 className="modal-title"&gt;Delete Employee&lt;/h4&gt;
                  &lt;/div&gt;
  
  
                    &lt;div className="container"&gt;
                    &lt;div className="modal-body"&gt;
                          Are you sure you want to delete {this.state.Employee_Name}?
                    &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;div className="modal-footer"&gt;
                  &lt;input type="submit" className ="btn btn-danger"  data-dismiss="modal" onClick={this.deleteEmployee.bind(this, this.state.Employee_ID ,this.state.i)}/&gt;
                  &lt;button type="button" className="btn btn-default" data-dismiss="modal" &gt;Close&lt;/button&gt;
                &lt;/div&gt;
  
  
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>but the onclick on my modal can't see the index please help me because it always delete the first row</p>
  
  <pre><code>deleteEmployee(id, index) {
    jQuery.support.cors = true;
      fetch('http://localhost:5118/api/employeedetails/DeleteEmployeeDetail/'+ id, {
           method: 'GET'
    }).then(function(response) {
       // history.go(0);
        var jsonReturnedValue = [...this.state.jsonReturnedValue];
        this.setState({jsonReturnedValue})
    }).catch(function(err) {
      // Error :(
    });
      this.state.jsonReturnedValue.splice(index, 1)
      this.setState({})
  }
  </code></pre>