Skip to content

Commit

Permalink
example for #1451
Browse files Browse the repository at this point in the history
  • Loading branch information
AllenFang committed Jul 16, 2017
1 parent 5999c48 commit 5823e2a
Show file tree
Hide file tree
Showing 2 changed files with 50 additions and 0 deletions.
10 changes: 10 additions & 0 deletions examples/js/style/demo.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ require('./style.css');
import React from 'react';
import TrClassStringTable from './tr-class-string-table';
import TrClassFunctionTable from './tr-class-function-table';
import TrStyleTable from './tr-style-table';
import TdClassStringTable from './td-class-string-table';
import TdClassFunctionTable from './td-class-function-table';
import EditTdClassTable from './edit-td-class-table';
Expand Down Expand Up @@ -41,6 +42,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'>Set String or Function for <code>trStyle</code> on &lt;BootstrapTable&gt;</div>
<div className='panel-body'>
<h5>Source in /examples/js/style/tr-style-table.js</h5>
<TrStyleTable />
</div>
</div>
</div>
<div className='col-md-offset-1 col-md-8'>
<div className='panel panel-default'>
<div className='panel-heading'>Set String as <code>classname</code> & <code>columnClassName</code> on &lt;TableHeaderColumn&gt;(header &amp; column)</div>
Expand Down
40 changes: 40 additions & 0 deletions examples/js/style/tr-style-table.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
/* eslint max-len: 0 */
/* eslint no-unused-vars: 0 */
import React from 'react';
import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';


const products = [];

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


addProducts(5);

export default class TrClassStringTable extends React.Component {

trStyle = (row, rowIndex) => {
return { backgroundColor: '#FFFAFA' };
}

render() {
const selectRow = { mode: 'checkbox', bgColor: 'red' };
return (
<BootstrapTable data={ products } trStyle={ this.trStyle } selectRow={ selectRow }>
<TableHeaderColumn dataField='id' isKey={ true }>Product ID</TableHeaderColumn>
<TableHeaderColumn dataField='name'>Product Name</TableHeaderColumn>
<TableHeaderColumn dataField='price'>Product Price</TableHeaderColumn>
</BootstrapTable>
);
}
}

0 comments on commit 5823e2a

Please sign in to comment.