Skip to content

Commit 64c24eb

Browse files
committed
example for #212
1 parent 0d07a50 commit 64c24eb

File tree

1 file changed

+21
-6
lines changed

1 file changed

+21
-6
lines changed

examples/js/sort/sort-table.js

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,15 +18,30 @@ function addProducts(quantity) {
1818
}
1919

2020
addProducts(5);
21-
21+
var order = 'desc';
2222
export default class SortTable extends React.Component{
23+
24+
handleBtnClick = e => {
25+
if(order === 'desc'){
26+
this.refs.table.handleSort('asc', 'name');
27+
order = 'asc';
28+
} else {
29+
this.refs.table.handleSort('desc', 'name');
30+
order = 'desc';
31+
}
32+
}
33+
2334
render(){
2435
return (
25-
<BootstrapTable data={products}>
26-
<TableHeaderColumn dataField="id" isKey={true} dataSort={true}>Product ID</TableHeaderColumn>
27-
<TableHeaderColumn dataField="name" dataSort={true}>Product Name</TableHeaderColumn>
28-
<TableHeaderColumn dataField="price">Product Price</TableHeaderColumn>
29-
</BootstrapTable>
36+
<div>
37+
<p style={{color:'red'}}>You cam click header to sort or click following button to perform a sorting by expose API</p>
38+
<button onClick={this.handleBtnClick}>Sort Product Name</button>
39+
<BootstrapTable ref="table" data={products}>
40+
<TableHeaderColumn dataField="id" isKey={true} dataSort={true}>Product ID</TableHeaderColumn>
41+
<TableHeaderColumn dataField="name" dataSort={true}>Product Name</TableHeaderColumn>
42+
<TableHeaderColumn dataField="price">Product Price</TableHeaderColumn>
43+
</BootstrapTable>
44+
</div>
3045
);
3146
}
3247
};

0 commit comments

Comments
 (0)