Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 7b593a7

Browse files
fix #1231 
1 parent 7162728 commit 7b593a7

File tree

6 files changed

+25
-6
lines changed

6 files changed

+25
-6
lines changed

‎docs/README.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
* [classes](#classes)
2222
* [wrapperClasses](#wrapperClasses)
2323
* [headerClasses](#headerClasses)
24+
* [headerWrapperClasses](#headerWrapperClasses)
2425
* [cellEdit](#cellEdit)
2526
* [selectRow](#selectRow)
2627
* [expandRow](#expandRow)
@@ -137,6 +138,9 @@ Customize class on the outer element which wrap up the `table` element.
137138
### <a name='headerClasses'>headerClasses - [String]</a>
138139
Customize class on the header row(`tr`).
139140

141+
### <a name='headerWrapperClasses'>headerWrapperClasses - [String]</a>
142+
Customize class on the `thead`.
143+
140144
### <a name='cellEdit'>cellEdit - [Object]</a>
141145
Makes table cells editable, please see [cellEdit definition](./cell-edit.md) for more detail.
142146

‎packages/react-bootstrap-table2-example/examples/basic/customized-id-classes.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ const columns = [{
3333
3434
<BootstrapTable id="bar" keyField='id' data={ products } columns={ columns } />
3535
<BootstrapTable classes="foo" keyField='id' data={ products } columns={ columns } />
36+
<BootstrapTable headerWrapperClasses="foo" keyField="id" data={ products } columns={ columns } />
37+
<BootstrapTable bodyClasses="foo" keyField="id" data={ products } columns={ columns } />
3638
<BootstrapTable wrapperClasses="boo" keyField="id" data={ products } columns={ columns } />
3739
`;
3840

@@ -44,6 +46,12 @@ export default () => (
4446
<h4> Customized table className </h4>
4547
<BootstrapTable classes="foo" keyField="id" data={ products } columns={ columns } />
4648

49+
<h4> Customized thead className </h4>
50+
<BootstrapTable headerWrapperClasses="foo" keyField="id" data={ products } columns={ columns } />
51+
52+
<h4> Customized tbody className </h4>
53+
<BootstrapTable bodyClasses="foo" keyField="id" data={ products } columns={ columns } />
54+
4755
<h4> Customized wrapper className </h4>
4856
<BootstrapTable wrapperClasses="boo" keyField="id" data={ products } columns={ columns } />
4957

‎packages/react-bootstrap-table2-example/stories/stylesheet/base-table/_index.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
table.foo {
1+
.foo {
22
background-color: $grey-500;
33
}
44

‎packages/react-bootstrap-table2/src/body.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,8 @@ class Body extends React.Component {
6060
rowStyle,
6161
rowClasses,
6262
rowEvents,
63-
expandRow
63+
expandRow,
64+
className
6465
} = this.props;
6566

6667
let content;
@@ -110,7 +111,7 @@ class Body extends React.Component {
110111
}
111112

112113
return (
113-
<tbody>{ content }</tbody>
114+
<tbodyclassName={className}>{ content }</tbody>
114115
);
115116
}
116117
}

‎packages/react-bootstrap-table2/src/bootstrap-table.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,7 @@ class BootstrapTable extends PropsBaseResolver(Component) {
9494
<Header
9595
columns={ columns }
9696
className={ this.props.headerClasses }
97+
wrapperClasses={ this.props.headerWrapperClasses }
9798
sortField={ this.props.sortField }
9899
sortOrder={ this.props.sortOrder }
99100
onSort={ this.props.onSort }
@@ -119,6 +120,7 @@ class BootstrapTable extends PropsBaseResolver(Component) {
119120
/>
120121
)}
121122
<Body
123+
className={ this.props.bodyClasses }
122124
data={ this.getData() }
123125
keyField={ keyField }
124126
tabIndexCell={ tabIndexCell }
@@ -163,7 +165,10 @@ BootstrapTable.propTypes = {
163165
tabIndexCell: PropTypes.bool,
164166
id: PropTypes.string,
165167
classes: PropTypes.string,
168+
headerClasses: PropTypes.string,
169+
bodyClasses: PropTypes.string,
166170
wrapperClasses: PropTypes.string,
171+
headerWrapperClasses: PropTypes.string,
167172
condensed: PropTypes.bool,
168173
caption: PropTypes.oneOfType([
169174
PropTypes.node,
@@ -221,7 +226,6 @@ BootstrapTable.propTypes = {
221226
rowStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
222227
rowEvents: PropTypes.object,
223228
rowClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
224-
headerClasses: PropTypes.string,
225229
filtersClasses: PropTypes.string,
226230
filterPosition: PropTypes.oneOf([
227231
Const.FILTERS_POSITION_TOP,

‎packages/react-bootstrap-table2/src/header.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@ const Header = (props) => {
2222
currFilters,
2323
onExternalFilter,
2424
filterPosition,
25-
globalSortCaret
25+
globalSortCaret,
26+
wrapperClasses
2627
} = props;
2728

2829
let SelectionHeaderCellComp = () => null;
@@ -80,7 +81,7 @@ const Header = (props) => {
8081
}
8182

8283
return (
83-
<thead>
84+
<theadclassName={wrapperClasses}>
8485
<tr className={ className }>
8586
{ childrens }
8687
</tr>
@@ -99,6 +100,7 @@ Header.propTypes = {
99100
onExternalFilter: PropTypes.func,
100101
globalSortCaret: PropTypes.func,
101102
className: PropTypes.string,
103+
wrapperClasses: PropTypes.string,
102104
expandRow: PropTypes.object,
103105
filterPosition: PropTypes.oneOf([
104106
Const.FILTERS_POSITION_TOP,

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /