title: Sending row/cell data on click to the function - ReactJS
body: <p>I am retrieving table data from componentWillMount and showing it as UI. I want to trigger a fuction when the row/cell is clicked and return that value back to another PHP so that i can query the backend using that retrieved cell value.</p>
  
  <ul>
  <li>index = 0,1,2,3 ( I have 4 columns )</li>
  <li>row = data for each index.</li>
  </ul>
  
  <p>I am not sure why this.state.testTime is not sending the correct value to handleClick function. Does anyone have any inputs on this? Thanks.</p>
  
  <pre><code> _handleClick: function (event) {
          this.setState({testTime: event.target.value});
          console.log(event.target.value);    
          var data = {
              testTime: this.state.testTime
          }
  
          console.log("clicked");
          $.ajax({
              type: "GET",
              crossDomain: true,
              url: "http://localhost:8080/TEST/capture.php",
              data: data,
              success: function(data){
                  alert(data);
              },
              error:function(data)
              {
                  alert("Data sending failed");
              }
          });
      },
  
  return (
  &lt;tbody&gt;
   {tableData.map((row, index) =&gt; {
         return (
                &lt;tr key={"row_" + index} &gt;
                  {row.map((cell, index) =&gt; {
                      return (
                          &lt;td key={"cell_" + index} onClick={this._handleClick} value={this.state.testTime} &gt;{cell}&lt;/td&gt;
                           );
                   })}
                &lt;/tr&gt;
               );
    })}
  &lt;/tbody&gt;
  )
  </code></pre>