Skip to content

Commit

Permalink
Merge branch 'SebastianCoetzee-master'
Browse files Browse the repository at this point in the history
  • Loading branch information
AllenFang committed Jan 4, 2016
2 parents d9e1c14 + 7962e7a commit eb21ec8
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 10 deletions.
8 changes: 4 additions & 4 deletions dist/react-bootstrap-table.min.js

Large diffs are not rendered by default.

49 changes: 49 additions & 0 deletions examples/js/manipulation/del-row-custom-confirm.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
'use strict';
import React from 'react';
import {BootstrapTable, TableHeaderColumn} from 'react-bootstrap-table';


var products = [];

function addProducts(quantity) {
var startId = products.length;
for (var i = 0; i < quantity; i++) {
var id = startId + i;
products.push({
id: id,
name: "Item name " + id,
price: 2100 + i
});
}
}

addProducts(5);

function customConfirm(next){
if (confirm("(It's a custom confirm function)Are you sure you want to delete?")){
//If the confirmation is true, call the function that
//continues the deletion of the record.
next();
}
}

var options = {
handleConfirmDeleteRow: customConfirm
}

//If you want to enable deleteRow, you must enable row selection also.
var selectRowProp = {
mode: "checkbox"
};

export default class DeleteRowCustomComfirmTable extends React.Component{
render(){
return (
<BootstrapTable data={products} deleteRow={true} selectRow={selectRowProp} options={options}>
<TableHeaderColumn dataField="id" isKey={true}>Product ID</TableHeaderColumn>
<TableHeaderColumn dataField="name">Product Name</TableHeaderColumn>
<TableHeaderColumn dataField="price">Product Price</TableHeaderColumn>
</BootstrapTable>
);
}
};
10 changes: 10 additions & 0 deletions examples/js/manipulation/demo.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import SearchTable from './search-table';
import ColumnFilterTable from './filter-table';
import MultiSearchTable from './multi-search-table';
import ExportCSVTable from './export-csv-table';
import DeleteRowCustomComfirmTable from './del-row-custom-confirm';

class Demo extends React.Component {
render() {
Expand Down Expand Up @@ -66,6 +67,15 @@ class Demo extends React.Component {
</div>
</div>
</div>
<div className="col-md-offset-1 col-md-8">
<div className="panel panel-default">
<div className="panel-heading">Custom Confirmation for row deletion Example</div>
<div className="panel-body">
<h5>Source in /examples/js/manipulation/del-row-custom-confirm.js</h5>
<DeleteRowCustomComfirmTable />
</div>
</div>
</div>
</div>
);
}
Expand Down
26 changes: 20 additions & 6 deletions src/BootstrapTable.js
Original file line number Diff line number Diff line change
Expand Up @@ -394,14 +394,25 @@ class BootstrapTable extends React.Component {
}

handleDropRow(rowKeys) {
let result;
let that = this;
let dropRowKeys = rowKeys?rowKeys:this.store.getSelectedRowKeys();
//add confirm befor the delete action
//add confirm before the delete action if that option is set.
if (dropRowKeys && dropRowKeys.length > 0) {
if (!confirm('Are you sure want delete?')) {
return
if (this.props.options.handleConfirmDeleteRow){
this.props.options.handleConfirmDeleteRow(
function(){
that.deleteRow(dropRowKeys);
}
);
} else if (confirm('Are you sure want delete?')) {
this.deleteRow(dropRowKeys);
}
}
}

deleteRow(dropRowKeys){

let result;
this.store.remove(dropRowKeys); //remove selected Row
this.store.setSelectedRowKey([]); //clear selected row key

Expand All @@ -427,6 +438,7 @@ class BootstrapTable extends React.Component {
if (this.props.options.afterDeleteRow) {
this.props.options.afterDeleteRow(dropRowKeys);
}

}

handleFilterData(filterObj) {
Expand Down Expand Up @@ -623,7 +635,8 @@ BootstrapTable.propTypes = {
onSortChange: React.PropTypes.func,
onPageChange: React.PropTypes.func,
onSizePerPageList: React.PropTypes.func,
noDataText: React.PropTypes.string
noDataText: React.PropTypes.string,
handleConfirmDeleteRow: React.PropTypes.func
}),
fetchInfo: React.PropTypes.shape({
dataTotalSize: React.PropTypes.number,
Expand Down Expand Up @@ -675,7 +688,8 @@ BootstrapTable.defaultProps = {
sizePerPage: undefined,
paginationSize: Const.PAGINATION_SIZE,
onSizePerPageList: undefined,
noDataText: undefined
noDataText: undefined,
handleConfirmDeleteRow: undefined
},
fetchInfo: {
dataTotalSize: 0,
Expand Down

0 comments on commit eb21ec8

Please sign in to comment.