Skip to content

Commit eb21ec8

Browse files
committed
Merge branch 'SebastianCoetzee-master'
2 parents d9e1c14 + 7962e7a commit eb21ec8

File tree

4 files changed

+83
-10
lines changed

4 files changed

+83
-10
lines changed

dist/react-bootstrap-table.min.js

+4-4
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
'use strict';
2+
import React from 'react';
3+
import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table';
4+
5+
6+
var products = [];
7+
8+
function addProducts(quantity) {
9+
var startId = products.length;
10+
for (var i = 0; i < quantity; i++) {
11+
var id = startId + i;
12+
products.push({
13+
id: id,
14+
name: "Item name " + id,
15+
price: 2100 + i
16+
});
17+
}
18+
}
19+
20+
addProducts(5);
21+
22+
function customConfirm(next){
23+
if (confirm("(It's a custom confirm function)Are you sure you want to delete?")){
24+
//If the confirmation is true, call the function that
25+
//continues the deletion of the record.
26+
next();
27+
}
28+
}
29+
30+
var options = {
31+
handleConfirmDeleteRow: customConfirm
32+
}
33+
34+
//If you want to enable deleteRow, you must enable row selection also.
35+
var selectRowProp = {
36+
mode: "checkbox"
37+
};
38+
39+
export default class DeleteRowCustomComfirmTable extends React.Component{
40+
render(){
41+
return (
42+
<BootstrapTable data={products} deleteRow={true} selectRow={selectRowProp} options={options}>
43+
<TableHeaderColumn dataField="id" isKey={true}>Product ID</TableHeaderColumn>
44+
<TableHeaderColumn dataField="name">Product Name</TableHeaderColumn>
45+
<TableHeaderColumn dataField="price">Product Price</TableHeaderColumn>
46+
</BootstrapTable>
47+
);
48+
}
49+
};

examples/js/manipulation/demo.js

+10
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import SearchTable from './search-table';
55
import ColumnFilterTable from './filter-table';
66
import MultiSearchTable from './multi-search-table';
77
import ExportCSVTable from './export-csv-table';
8+
import DeleteRowCustomComfirmTable from './del-row-custom-confirm';
89

910
class Demo extends React.Component {
1011
render() {
@@ -66,6 +67,15 @@ class Demo extends React.Component {
6667
</div>
6768
</div>
6869
</div>
70+
<div className="col-md-offset-1 col-md-8">
71+
<div className="panel panel-default">
72+
<div className="panel-heading">Custom Confirmation for row deletion Example</div>
73+
<div className="panel-body">
74+
<h5>Source in /examples/js/manipulation/del-row-custom-confirm.js</h5>
75+
<DeleteRowCustomComfirmTable />
76+
</div>
77+
</div>
78+
</div>
6979
</div>
7080
);
7181
}

src/BootstrapTable.js

+20-6
Original file line numberDiff line numberDiff line change
@@ -394,14 +394,25 @@ class BootstrapTable extends React.Component {
394394
}
395395

396396
handleDropRow(rowKeys) {
397-
let result;
397+
let that = this;
398398
let dropRowKeys = rowKeys?rowKeys:this.store.getSelectedRowKeys();
399-
//add confirm befor the delete action
399+
//add confirm before the delete action if that option is set.
400400
if (dropRowKeys && dropRowKeys.length > 0) {
401-
if (!confirm('Are you sure want delete?')) {
402-
return
401+
if (this.props.options.handleConfirmDeleteRow){
402+
this.props.options.handleConfirmDeleteRow(
403+
function(){
404+
that.deleteRow(dropRowKeys);
405+
}
406+
);
407+
} else if (confirm('Are you sure want delete?')) {
408+
this.deleteRow(dropRowKeys);
403409
}
404410
}
411+
}
412+
413+
deleteRow(dropRowKeys){
414+
415+
let result;
405416
this.store.remove(dropRowKeys); //remove selected Row
406417
this.store.setSelectedRowKey([]); //clear selected row key
407418

@@ -427,6 +438,7 @@ class BootstrapTable extends React.Component {
427438
if (this.props.options.afterDeleteRow) {
428439
this.props.options.afterDeleteRow(dropRowKeys);
429440
}
441+
430442
}
431443

432444
handleFilterData(filterObj) {
@@ -623,7 +635,8 @@ BootstrapTable.propTypes = {
623635
onSortChange: React.PropTypes.func,
624636
onPageChange: React.PropTypes.func,
625637
onSizePerPageList: React.PropTypes.func,
626-
noDataText: React.PropTypes.string
638+
noDataText: React.PropTypes.string,
639+
handleConfirmDeleteRow: React.PropTypes.func
627640
}),
628641
fetchInfo: React.PropTypes.shape({
629642
dataTotalSize: React.PropTypes.number,
@@ -675,7 +688,8 @@ BootstrapTable.defaultProps = {
675688
sizePerPage: undefined,
676689
paginationSize: Const.PAGINATION_SIZE,
677690
onSizePerPageList: undefined,
678-
noDataText: undefined
691+
noDataText: undefined,
692+
handleConfirmDeleteRow: undefined
679693
},
680694
fetchInfo: {
681695
dataTotalSize: 0,

0 commit comments

Comments
 (0)