vhad/react-bootstrap-table2
1
0
Fork 0
mirror of https://github.com/gosticks/react-bootstrap-table2.git synced 2026-06-28 13:10:03 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

custom selection box

Browse Source
This commit is contained in:
AllenFang
2018-06-02 15:20:19 +08:00
parent 6019e550fd
commit a7b3690a7c
3 changed files with 46 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react-bootstrap-table2/src/bootstrap-table.js vendored
View File

@@ -142,7 +142,9 @@ BootstrapTable.propTypes = {
classes: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
nonSelectable: PropTypes.array,
bgColor: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
hideSelectColumn: PropTypes.bool
hideSelectColumn: PropTypes.bool,
selectionRenderer: PropTypes.func,
selectionHeaderRenderer: PropTypes.func
}),
onRowSelect: PropTypes.func,
onAllRowsSelect: PropTypes.func,

24
packages/react-bootstrap-table2/src/row-selection/selection-cell.js vendored
View File

@@ -14,7 +14,8 @@ export default class SelectionCell extends Component {
onRowSelect: PropTypes.func,
disabled: PropTypes.bool,
rowIndex: PropTypes.number,
clickToSelect: PropTypes.bool
clickToSelect: PropTypes.bool,
selectionRenderer: PropTypes.func
}
constructor() {
@@ -53,16 +54,25 @@ export default class SelectionCell extends Component {
const {
mode: inputType,
selected,
disabled
disabled,
selectionRenderer
} = this.props;
return (
<td onClick={ this.handleClick }>
<input
type={ inputType }
checked={ selected }
disabled={ disabled }
/>
{
selectionRenderer ? selectionRenderer({
mode: inputType,
checked: selected,
disabled
}) : (
<input
type={ inputType }
checked={ selected }
disabled={ disabled }
/>
)
}
</td>
);
}

39
packages/react-bootstrap-table2/src/row-selection/selection-header-cell.js vendored
View File

@@ -22,7 +22,8 @@ export default class SelectionHeaderCell extends Component {
static propTypes = {
mode: PropTypes.string.isRequired,
checkedStatus: PropTypes.string,
onAllRowsSelect: PropTypes.func
onAllRowsSelect: PropTypes.func,
selectionHeaderRenderer: PropTypes.func
}
constructor() {
@@ -52,25 +53,37 @@ export default class SelectionHeaderCell extends Component {
render() {
const {
CHECKBOX_STATUS_CHECKED, CHECKBOX_STATUS_INDETERMINATE, ROW_SELECT_SINGLE
CHECKBOX_STATUS_CHECKED, CHECKBOX_STATUS_INDETERMINATE, ROW_SELECT_MULTIPLE
} = Const;
const { mode, checkedStatus } = this.props;
const { mode, checkedStatus, selectionHeaderRenderer } = this.props;
const checked = checkedStatus === CHECKBOX_STATUS_CHECKED;
const indeterminate = checkedStatus === CHECKBOX_STATUS_INDETERMINATE;
return mode === ROW_SELECT_SINGLE
? <th data-row-selection />
: (
<th data-row-selection onClick={ this.handleCheckBoxClick }>
<CheckBox
{ ...this.props }
checked={ checked }
indeterminate={ indeterminate }
/>
</th>
const attrs = {};
let content;
if (selectionHeaderRenderer) {
content = selectionHeaderRenderer({
mode,
checked,
indeterminate
});
attrs.onClick = this.handleCheckBoxClick;
} else if (mode === ROW_SELECT_MULTIPLE) {
content = (
<CheckBox
{ ...this.props }
checked={ checked }
indeterminate={ indeterminate }
/>
);
attrs.onClick = this.handleCheckBoxClick;
}
return (
<th data-row-selection { ...attrs }>{ content }</th>
);
}
}