Trying to get onRowClick to work, but nothing is happening when I click on the row.
<BootstrapTable data={products} onRowClick={this.onClickHandler.bind(this)} striped={true} hover={true} pagination={true} search={true} searchPlaceholder="Search">
<TableHeaderColumn isKey={true} dataField="_id">Customer ID</TableHeaderColumn>
<TableHeaderColumn dataField="customername" >Customer Name</TableHeaderColumn>
<TableHeaderColumn dataField="address">Address</TableHeaderColumn>
<TableHeaderColumn dataField="city">City</TableHeaderColumn>
<TableHeaderColumn dataField="createdate">Last Order Date</TableHeaderColumn>
<TableHeaderColumn dataField="style">Style</TableHeaderColumn>
<TableHeaderColumn dataField="dimensions">Dimensions</TableHeaderColumn>
</BootstrapTable>
Sorry just figured it out
have to set options
var options = {
onRowClick: function(row){
}
}
<BootstrapTable data={products} options={options} ...
For me I am using react-bootstrap-table-next
- v 4.0.3
and the above solution didn't work for some reason. Where as the following implementation worked.
const tableRowEvents = {
onClick: (e, row, rowIndex) => {
console.log(`clicked on row with index: ${rowIndex}`);
},
onMouseEnter: (e, row, rowIndex) => {
console.log(`enter on row with index: ${rowIndex}`);
}
}
<BootstrapTable
hover
bordered={false}
bootstrap4
keyField={"apps.App"}
data={apps ? apps : no_Data}
columns={columns}
rowEvents={ tableRowEvents }
/>
I followed the documentation from react-bootstrap-table2
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With