Skip to content

Commit 5a26648

Browse files
committed
Merge branch 'master' into custom-tsv-csv-button
2 parents 9c9810f + 6a5087f commit 5a26648

File tree

10 files changed

+149
-50
lines changed

10 files changed

+149
-50
lines changed

CHANGELOG.md

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,32 @@
1+
<a name="v3.4.6"></a>
2+
# [v3.4.6](https://github.com/AllenFang/react-bootstrap-table/compare/v3.4.5...v3.4.6) (2017-07-16)
3+
## Bug fixes
4+
* Fix wrong cell edit if have multiple table but share same `cellEdit` props[8954de6](https://github.com/AllenFang/react-bootstrap-table/commit/8954de63c89bc9527f76d1023a5b931c3f14f175)
5+
6+
## Enhancement
7+
* Allow to configure `td` style via `trStyle` on `BootstrapTable`([5999c48](https://github.com/AllenFang/react-bootstrap-table/commit/5999c48902de5348c7525a49bc370a42da4fce36))
8+
9+
<a name="v3.4.5"></a>
10+
# [v3.4.5](https://github.com/AllenFang/react-bootstrap-table/compare/v3.4.4...v3.4.5) (2017-07-13)
11+
## Bug fixes
12+
* Fix [#1410](https://github.com/AllenFang/react-bootstrap-table/issues/1410) again([3f60275](https://github.com/AllenFang/react-bootstrap-table/commit/3f602755721529471ba5d5fa36ed2930d19dfbf5))
13+
14+
## Enhancement
15+
* Pass `rowIndex` as third argument for `options.onRowClick`([4b5ba03](https://github.com/AllenFang/react-bootstrap-table/commit/4b5ba037437977b54a577084e0779f53e9b02785))
16+
17+
## Features
18+
* Able to disable the `tabIndex` via `withoutTabIndex` on `BootstrapTable`([ce6f744](https://github.com/AllenFang/react-bootstrap-table/commit/ce6f744d3d7f101c800459a7d0608daed5dff74e))
19+
20+
<a name="v3.4.4"></a>
21+
# [v3.4.4](https://github.com/AllenFang/react-bootstrap-table/compare/v3.4.3...v3.4.4) (2017-07-09)
22+
## Bug fixes
23+
* Pass row object as second argument for `editable.validator` when calling by insert row([5ede872](https://github.com/AllenFang/react-bootstrap-table/commit/5ede87270677c9d8fe37bdef2cccbf4a05f5748a))
24+
* Fix text filter is not updated when rerender([298e971](https://github.com/AllenFang/react-bootstrap-table/commit/298e971b5c5658d0baeb67163d279298751085ed))
25+
* Fix wrong colspan on a empty table when hide seleciton column([62ceb31](https://github.com/AllenFang/react-bootstrap-table/commit/62ceb313f6d523e02f5b49275b69b3b4e3326e7a))
26+
27+
## Enhancement
28+
* return `false` will render default editor in insert model for the hook function of [customInsertEditor.getElement](http://allenfang.github.io/react-bootstrap-table/custom.html#insertmodalfield)([f2382b3](https://github.com/AllenFang/react-bootstrap-table/commit/f2382b36cc924e286ec271f92134673278458c3c))
29+
130
<a name="v3.4.3"></a>
231
# [v3.4.3](https://github.com/AllenFang/react-bootstrap-table/compare/v3.4.2...v3.4.3) (2017-07-05)
332
## Bug fixes

dist/react-bootstrap-table.js

Lines changed: 36 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -283,6 +283,10 @@ return /******/ (function(modules) { // webpackBootstrap
283283
return _this.__handleSelectRow__REACT_HOT_LOADER__.apply(_this, arguments);
284284
};
285285

286+
_this.handleEditCell = function () {
287+
return _this.__handleEditCell__REACT_HOT_LOADER__.apply(_this, arguments);
288+
};
289+
286290
_this.handleAddRow = function () {
287291
return _this.__handleAddRow__REACT_HOT_LOADER__.apply(_this, arguments);
288292
};
@@ -316,7 +320,6 @@ return /******/ (function(modules) { // webpackBootstrap
316320
};
317321

318322
_this.isIE = false;
319-
_this._attachCellEditFunc();
320323
if (_util2.default.canUseDOM()) {
321324
_this.isIE = document.documentMode;
322325
}
@@ -656,23 +659,10 @@ return /******/ (function(modules) { // webpackBootstrap
656659
key: 'componentDidUpdate',
657660
value: function componentDidUpdate() {
658661
this._adjustTable();
659-
this._attachCellEditFunc();
660662
if (this.props.options.afterTableComplete) {
661663
this.props.options.afterTableComplete();
662664
}
663665
}
664-
}, {
665-
key: '_attachCellEditFunc',
666-
value: function _attachCellEditFunc() {
667-
var cellEdit = this.props.cellEdit;
668-
669-
if (cellEdit) {
670-
this.props.cellEdit.__onCompleteEdit__ = this.handleEditCell.bind(this);
671-
if (cellEdit.mode !== _Const2.default.CELL_EDIT_NONE) {
672-
this.props.selectRow.clickToSelect = false;
673-
}
674-
}
675-
}
676666

677667
/**
678668
* Returns true if in the current configuration,
@@ -739,6 +729,10 @@ return /******/ (function(modules) { // webpackBootstrap
739729

740730
var showPaginationOnTop = paginationPosition !== _Const2.default.PAGINATION_POS_BOTTOM;
741731
var showPaginationOnBottom = paginationPosition !== _Const2.default.PAGINATION_POS_TOP;
732+
var selectRow = _extends({}, this.props.selectRow);
733+
if (this.props.cellEdit && this.props.cellEdit.mode !== _Const2.default.CELL_EDIT_NONE) {
734+
selectRow.clickToSelect = false;
735+
}
742736

743737
return _react2.default.createElement(
744738
'div',
@@ -791,12 +785,13 @@ return /******/ (function(modules) { // webpackBootstrap
791785
expandParentClass: this.props.options.expandParentClass,
792786
columns: columns,
793787
trClassName: this.props.trClassName,
788+
trStyle: this.props.trStyle,
794789
striped: this.props.striped,
795790
bordered: this.props.bordered,
796791
hover: this.props.hover,
797792
keyField: this.store.getKeyField(),
798793
condensed: this.props.condensed,
799-
selectRow: this.props.selectRow,
794+
selectRow: selectRow,
800795
expandColumnOptions: this.props.expandColumnOptions,
801796
cellEdit: this.props.cellEdit,
802797
selectedRowKeys: this.state.selectedRowKeys,
@@ -815,7 +810,8 @@ return /******/ (function(modules) { // webpackBootstrap
815810
onNavigateCell: this.handleNavigateCell,
816811
x: this.state.x,
817812
y: this.state.y,
818-
withoutTabIndex: this.props.withoutTabIndex })
813+
withoutTabIndex: this.props.withoutTabIndex,
814+
onEditCell: this.handleEditCell })
819815
),
820816
tableFilter,
821817
showPaginationOnBottom ? pagination : null
@@ -1206,8 +1202,8 @@ return /******/ (function(modules) { // webpackBootstrap
12061202
}
12071203
}
12081204
}, {
1209-
key: 'handleEditCell',
1210-
value: function handleEditCell(newVal, rowIndex, colIndex) {
1205+
key: '__handleEditCell__REACT_HOT_LOADER__',
1206+
value: function __handleEditCell__REACT_HOT_LOADER__(newVal, rowIndex, colIndex) {
12111207
var _this6 = this;
12121208

12131209
var beforeSaveCell = this.props.cellEdit.beforeSaveCell;
@@ -1951,6 +1947,7 @@ return /******/ (function(modules) { // webpackBootstrap
19511947
strictSearch: _react.PropTypes.bool,
19521948
columnFilter: _react.PropTypes.bool,
19531949
trClassName: _react.PropTypes.any,
1950+
trStyle: _react.PropTypes.any,
19541951
tableStyle: _react.PropTypes.object,
19551952
containerStyle: _react.PropTypes.object,
19561953
headerStyle: _react.PropTypes.object,
@@ -2109,6 +2106,7 @@ return /******/ (function(modules) { // webpackBootstrap
21092106
multiColumnSort: 1,
21102107
columnFilter: false,
21112108
trClassName: '',
2109+
trStyle: undefined,
21122110
tableStyle: undefined,
21132111
containerStyle: undefined,
21142112
headerStyle: undefined,
@@ -2921,7 +2919,8 @@ return /******/ (function(modules) { // webpackBootstrap
29212919
beforeShowError = _props.beforeShowError,
29222920
x = _props.x,
29232921
y = _props.y,
2924-
keyBoardNav = _props.keyBoardNav;
2922+
keyBoardNav = _props.keyBoardNav,
2923+
trStyle = _props.trStyle;
29252924

29262925
var tableClasses = (0, _classnames2.default)('table', {
29272926
'table-striped': this.props.striped,
@@ -3060,7 +3059,8 @@ return /******/ (function(modules) { // webpackBootstrap
30603059
onRowMouseOut: this.handleRowMouseOut,
30613060
onSelectRow: this.handleSelectRow,
30623061
onExpandRow: this.handleClickCell,
3063-
unselectableRow: disable },
3062+
unselectableRow: disable,
3063+
style: trStyle },
30643064
this.props.expandColumnOptions.expandColumnVisible && this.props.expandColumnOptions.expandColumnBeforeSelectColumn && expandedRowColumn,
30653065
selectRowColumn,
30663066
this.props.expandColumnOptions.expandColumnVisible && !this.props.expandColumnOptions.expandColumnBeforeSelectColumn && expandedRowColumn,
@@ -3091,7 +3091,7 @@ return /******/ (function(modules) { // webpackBootstrap
30913091
}).length + (isSelectRowDefined && !this.props.selectRow.hideSelectColumn ? 1 : 0) + (this.props.expandColumnOptions.expandColumnVisible ? 1 : 0);
30923092
tableRows = [_react2.default.createElement(
30933093
_TableRow2.default,
3094-
{ key: '##table-empty##' },
3094+
{ key: '##table-empty##', style: trStyle },
30953095
_react2.default.createElement(
30963096
'td',
30973097
{ 'data-toggle': 'collapse',
@@ -3333,7 +3333,7 @@ return /******/ (function(modules) { // webpackBootstrap
33333333
key: '__handleCompleteEditCell__REACT_HOT_LOADER__',
33343334
value: function __handleCompleteEditCell__REACT_HOT_LOADER__(newVal, rowIndex, columnIndex) {
33353335
if (newVal !== null) {
3336-
var result = this.props.cellEdit.__onCompleteEdit__(newVal, rowIndex, columnIndex);
3336+
var result = this.props.onEditCell(newVal, rowIndex, columnIndex);
33373337
if (result !== _Const2.default.AWAIT_BEFORE_CELL_EDIT) {
33383338
this.setState(function () {
33393339
return { currEditCell: null };
@@ -3773,7 +3773,9 @@ return /******/ (function(modules) { // webpackBootstrap
37733773
selectRow = _props2.selectRow,
37743774
row = _props2.row,
37753775
isSelected = _props2.isSelected,
3776-
className = _props2.className;
3776+
className = _props2.className,
3777+
index = _props2.index;
3778+
var style = this.props.style;
37773779

37783780
var backgroundColor = null;
37793781
var selectRowClass = null;
@@ -3784,8 +3786,17 @@ return /******/ (function(modules) { // webpackBootstrap
37843786
selectRowClass = _util2.default.isFunction(selectRow.className) ? selectRow.className(row, isSelected) : isSelected ? selectRow.className : null;
37853787
}
37863788

3789+
if (_util2.default.isFunction(style)) {
3790+
style = style(row, index);
3791+
} else {
3792+
style = _extends({}, style) || {};
3793+
}
3794+
// the bgcolor of row selection always overwrite the bgcolor defined by global.
3795+
if (style && backgroundColor && isSelected) {
3796+
style.backgroundColor = backgroundColor;
3797+
}
37873798
var trCss = {
3788-
style: { backgroundColor: backgroundColor },
3799+
style: _extends({}, style),
37893800
className: (0, _classnames2.default)(selectRowClass, className)
37903801
};
37913802

@@ -3807,6 +3818,7 @@ return /******/ (function(modules) { // webpackBootstrap
38073818
TableRow.propTypes = {
38083819
index: _react.PropTypes.number,
38093820
row: _react.PropTypes.any,
3821+
style: _react.PropTypes.any,
38103822
isSelected: _react.PropTypes.bool,
38113823
enableCellEdit: _react.PropTypes.bool,
38123824
onRowClick: _react.PropTypes.func,

dist/react-bootstrap-table.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/react-bootstrap-table.min.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

examples/js/style/demo.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ require('./style.css');
33
import React from 'react';
44
import TrClassStringTable from './tr-class-string-table';
55
import TrClassFunctionTable from './tr-class-function-table';
6+
import TrStyleTable from './tr-style-table';
67
import TdClassStringTable from './td-class-string-table';
78
import TdClassFunctionTable from './td-class-function-table';
89
import EditTdClassTable from './edit-td-class-table';
@@ -41,6 +42,15 @@ class Demo extends React.Component {
4142
</div>
4243
</div>
4344
</div>
45+
<div className='col-md-offset-1 col-md-8'>
46+
<div className='panel panel-default'>
47+
<div className='panel-heading'>Set String or Function for <code>trStyle</code> on &lt;BootstrapTable&gt;</div>
48+
<div className='panel-body'>
49+
<h5>Source in /examples/js/style/tr-style-table.js</h5>
50+
<TrStyleTable />
51+
</div>
52+
</div>
53+
</div>
4454
<div className='col-md-offset-1 col-md-8'>
4555
<div className='panel panel-default'>
4656
<div className='panel-heading'>Set String as <code>classname</code> & <code>columnClassName</code> on &lt;TableHeaderColumn&gt;(header &amp; column)</div>
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
/* eslint max-len: 0 */
2+
/* eslint no-unused-vars: 0 */
3+
import React from 'react';
4+
import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
5+
6+
7+
const products = [];
8+
9+
function addProducts(quantity) {
10+
const startId = products.length;
11+
for (let i = 0; i < quantity; i++) {
12+
const id = startId + i;
13+
products.push({
14+
id: id,
15+
name: 'Item name ' + id,
16+
price: 2100 + i
17+
});
18+
}
19+
}
20+
21+
22+
addProducts(5);
23+
24+
export default class TrClassStringTable extends React.Component {
25+
26+
trStyle = (row, rowIndex) => {
27+
return { backgroundColor: '#FFFAFA' };
28+
}
29+
30+
render() {
31+
const selectRow = { mode: 'checkbox', bgColor: 'red' };
32+
return (
33+
<BootstrapTable data={ products } trStyle={ this.trStyle } selectRow={ selectRow }>
34+
<TableHeaderColumn dataField='id' isKey={ true }>Product ID</TableHeaderColumn>
35+
<TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>
36+
<TableHeaderColumn dataField='price'>Product Price</TableHeaderColumn>
37+
</BootstrapTable>
38+
);
39+
}
40+
}

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-bootstrap-table",
3-
"version": "3.4.5",
3+
"version": "3.4.6",
44
"description": "It's a react table for bootstrap",
55
"main": "./lib/index.js",
66
"repository": {

src/BootstrapTable.js

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ class BootstrapTable extends Component {
1818
constructor(props) {
1919
super(props);
2020
this.isIE = false;
21-
this._attachCellEditFunc();
2221
if (Util.canUseDOM()) {
2322
this.isIE = document.documentMode;
2423
}
@@ -326,22 +325,11 @@ class BootstrapTable extends Component {
326325

327326
componentDidUpdate() {
328327
this._adjustTable();
329-
this._attachCellEditFunc();
330328
if (this.props.options.afterTableComplete) {
331329
this.props.options.afterTableComplete();
332330
}
333331
}
334332

335-
_attachCellEditFunc() {
336-
const { cellEdit } = this.props;
337-
if (cellEdit) {
338-
this.props.cellEdit.__onCompleteEdit__ = this.handleEditCell.bind(this);
339-
if (cellEdit.mode !== Const.CELL_EDIT_NONE) {
340-
this.props.selectRow.clickToSelect = false;
341-
}
342-
}
343-
}
344-
345333
/**
346334
* Returns true if in the current configuration,
347335
* the datagrid should load its data remotely.
@@ -394,6 +382,10 @@ class BootstrapTable extends Component {
394382
const { paginationPosition = Const.PAGINATION_POS_BOTTOM } = this.props.options;
395383
const showPaginationOnTop = paginationPosition !== Const.PAGINATION_POS_BOTTOM;
396384
const showPaginationOnBottom = paginationPosition !== Const.PAGINATION_POS_TOP;
385+
const selectRow = { ...this.props.selectRow };
386+
if (this.props.cellEdit && this.props.cellEdit.mode !== Const.CELL_EDIT_NONE) {
387+
selectRow.clickToSelect = false;
388+
}
397389

398390
return (
399391
<div className={ classSet('react-bs-table-container', this.props.className, this.props.containerClass) }
@@ -441,12 +433,13 @@ class BootstrapTable extends Component {
441433
expandParentClass={ this.props.options.expandParentClass }
442434
columns={ columns }
443435
trClassName={ this.props.trClassName }
436+
trStyle={ this.props.trStyle }
444437
striped={ this.props.striped }
445438
bordered={ this.props.bordered }
446439
hover={ this.props.hover }
447440
keyField={ this.store.getKeyField() }
448441
condensed={ this.props.condensed }
449-
selectRow={ this.props.selectRow }
442+
selectRow={ selectRow }
450443
expandColumnOptions={ this.props.expandColumnOptions }
451444
cellEdit={ this.props.cellEdit }
452445
selectedRowKeys={ this.state.selectedRowKeys }
@@ -465,7 +458,8 @@ class BootstrapTable extends Component {
465458
onNavigateCell={ this.handleNavigateCell }
466459
x={ this.state.x }
467460
y={ this.state.y }
468-
withoutTabIndex={ this.props.withoutTabIndex } />
461+
withoutTabIndex={ this.props.withoutTabIndex }
462+
onEditCell={ this.handleEditCell } />
469463
</div>
470464
{ tableFilter }
471465
{ showPaginationOnBottom ? pagination : null }
@@ -792,7 +786,7 @@ class BootstrapTable extends Component {
792786
}
793787
}
794788

795-
handleEditCell(newVal, rowIndex, colIndex) {
789+
handleEditCell = (newVal, rowIndex, colIndex) => {
796790
const { beforeSaveCell } = this.props.cellEdit;
797791
const columns = this.getColumnsDescription(this.props);
798792
const fieldName = columns[colIndex].name;
@@ -1478,6 +1472,7 @@ BootstrapTable.propTypes = {
14781472
strictSearch: PropTypes.bool,
14791473
columnFilter: PropTypes.bool,
14801474
trClassName: PropTypes.any,
1475+
trStyle: PropTypes.any,
14811476
tableStyle: PropTypes.object,
14821477
containerStyle: PropTypes.object,
14831478
headerStyle: PropTypes.object,
@@ -1640,6 +1635,7 @@ BootstrapTable.defaultProps = {
16401635
multiColumnSort: 1,
16411636
columnFilter: false,
16421637
trClassName: '',
1638+
trStyle: undefined,
16431639
tableStyle: undefined,
16441640
containerStyle: undefined,
16451641
headerStyle: undefined,

0 commit comments

Comments
 (0)