bekomme die Zeilendaten über eine Schaltfläche in einer react-bootstrap-Tabelle

Question

Ich verwende react-bootstrap-table (var ReactBsTable = require ("react-bootstrap-table")).
Ich habe versucht, eine Schaltfläche hinzuzufügen, die beim Klicken die ID oder die Zeile Datenkorrespondent zu dieser Schaltfläche anzeigen. Ich benutze jquery, aber ich gebe eine ID auf die Schaltfläche, aber alle diese Schaltflächen hätten die gleiche ID (validatebutton), so dass nur die erste Arbeit und der Rest nicht, weil ich nicht die gleiche ID für viele Komponenten haben kann.

Irgendeine Idee bitte.

<BootstrapTable data={this.state.activities} pagination={true} hover={true} search={true} selectRow={selectRowProp} options={options}> 
<TableHeaderColumn isKey={true} dataField="id" hidden {true}>ID</TableHeaderColumn> 
<TableHeaderColumn dataField="title" dataSort={true}>Title</TableHeaderColumn> 
<TableHeaderColumn dataField="adress" dataSort{true}>Adress</TableHeaderColumn> 
<TableHeaderColumn dataField="button" dataFormat={this.buttonFunction}></TableHeaderColumn> 

</BootstrapTable> 

buttonFunction: function (cell, row) { 
    var today = new Date().toISOString(); 
    if (row.status === "En cours") { 
     if (row.dateEnd > today) { 
      return <Alert_Validate></Alert_Validate>; 
     } else { 
      return <label> 
       <button type="button" id="validatebutton" onClick=  {this._validateFunction} className="bbtn btn-primary btn-sm"><i className="fa fa-check fa-1x" aria-hidden="true"></i> 
       </button> 
      </label> 

     } 
    } 
}, 

_validateFunction: function() { 
    var userid=this.props.params.id; 
    $("#validatebutton").click(function() { 
     var $row = $(this).closest("tr"); 
     var activityid = $row.find("td:nth-child(2)"); 
     console.log("activity id :"+activityid.text()); 
    }); 

Answer 1

Statt für Ihre Daten durch das DOM des Suchens, können Sie es als Parameter an Ihre _validateFunction passieren könnte:

buttonFunction(cell, row) {  
    return <label> 
      <button type="button" 
        id="validatebutton" 
        onClick={() => {this._validateFunction(row)}} 
        className="bbtn btn-primary btn-sm"> 
         Click Me 
      </button> 
     </label>   
} 

Hier ist eine Geige, es zu zeigen: https://jsfiddle.net/omerts/5asms7j7/