Skip to content

Commit 06acd53

Browse files
committed
added example with footer atribute
1 parent 21e021b commit 06acd53

File tree

1 file changed

+18
-18
lines changed

1 file changed

+18
-18
lines changed

examples/js/sort/custom-sort-table-has-footer.js

+18-18
Original file line numberDiff line numberDiff line change
@@ -6,35 +6,35 @@ import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
66
const products = [];
77

88
function addProducts(quantity) {
9+
let value;
910
const startId = products.length;
11+
let total = 0;
1012
for (let i = 0; i < quantity; i++) {
1113
const id = startId + i;
12-
if (i === quantity - 1) {
13-
products.push({
14-
id: id,
15-
name: 'Footer ',
16-
price: 2100 + Math.floor(Math.random() * 100) + 1,
17-
isFooter: true
18-
});
19-
} else {
20-
products.push({
21-
id: id,
22-
name: 'Item name ' + id,
23-
price: 2100 + Math.floor(Math.random() * 100) + 1,
24-
isFooter: false
25-
});
26-
}
14+
value = 2100 + Math.floor(Math.random() * 100) + 1;
15+
products.push({
16+
id: id,
17+
name: 'Item name ' + id,
18+
cost: value
19+
});
20+
total += value;
2721
}
22+
/* add footer row with total calculations */
23+
products.push({
24+
id: products.length,
25+
name: 'Total',
26+
cost: total
27+
});
2828
}
2929

3030
addProducts(20);
3131

3232
function revertSortFunc(a, b, order) { // order is desc or asc
3333

3434
if (order === 'desc') {
35-
return a.price - b.price;
35+
return a.cost - b.cost;
3636
} else {
37-
return b.price - a.price;
37+
return b.cost - a.cost;
3838
}
3939
}
4040

@@ -55,7 +55,7 @@ export default class CustomSortTableHasFooter extends React.Component {
5555
<BootstrapTable data={ products } options={ options }>
5656
<TableHeaderColumn dataField='id' isKey={ true } dataSort={ true }>Product ID</TableHeaderColumn>
5757
<TableHeaderColumn dataField='name' dataSort={ true } sortFunc={ sortStrings }>Product Name</TableHeaderColumn>
58-
<TableHeaderColumn dataField='price' dataSort={ true } sortFunc={ revertSortFunc }>Product Price</TableHeaderColumn>
58+
<TableHeaderColumn dataField='cost' dataSort={ true } sortFunc={ revertSortFunc }>Product Cost</TableHeaderColumn>
5959
</BootstrapTable>
6060
);
6161
}

0 commit comments

Comments
 (0)