Advance Usage

There are some topic for advance usage for react-bootstrap-table. If you have any questions, feel free to ask example on github.

Cell Format with a React Component

react-bootstrap-table allow you to customize your column through a function which return a HTML string. Here is an example.
But also allow you return a "React Component". For Example: 
function priceFormatter(cell, row){
  return <ReactComponent price={cell} format="USD"/>;
}
<BootstrapTable data={products}>
  <TableHeaderColumn dataField="id" isKey={true}>Product ID</TableHeaderColumn>
  <TableHeaderColumn dataField="name">Product Name</TableHeaderColumn>
  <TableHeaderColumn dataField="price" dataFormat={priceFormatter}>Product Price</TableHeaderColumn>
</BootstrapTable>

Custom Sort

In react-bootstrap-table, you can assign a custom sort by sortFunc in <TableHeaderColumn>. A simple example in the below: 
var data = [
    {name: "test1", count: 1},
    {name: "test2", count: 6},
    {name: "test5", count: 0}
];
function mySortFunc(a, b, order){   //order is desc or asc
    return a.count - b.count;
}
//...
<BootstrapTable data={data} >
      <TableHeaderColumn dataField="name" isKey={true}>Name</TableHeaderColumn>
      <TableHeaderColumn dataField="count" dataSort={true} sortFunc={mySortFunc}>Count</TableHeaderColumn>
</BootstrapTable>

Cell Format with Extra Data

When you use dataFormat but need some extra or external data, you can use formatExtraData like following example

Sort Programmatically

If you want to make sorting programmatically, you can use handleSort API exposed by BootstrapTable. In following example, you can click button to perform a sorting by expose API.

Dynamic Select Row

react-bootstrap-table support the default selected row on table and also use the same way to allow user to set select row programmatically
You can reference an exmaple on gist as below

How to Get Selected Row?

Check following gist

A Custom Filter

react-bootstrap-table support a advance column filter on header, there are couple type provided: text, select, date or number. You can check these example on here However, you can custom yourself filter like following example

How to Get Current Page?

There are two way you can choose, check the following example

Advance Table Styling

In this example show we how to use a basic custom style on table. Following show how to do more customization styling.
trClassName and columnClassName also accept a function to make customization more flexible. Check docs

Advance Cell Editing

react-bootstrap-table support a basic cell editing but also give some useful data type on insertion and editing.