2

I have created a table with react bootstrap table next and I try to use the defaultSorted features. Here is an example from the doc:

import BootstrapTable from 'react-bootstrap-table-next';

const columns = [{
  dataField: 'id',
  text: 'Product ID',
  sort: true
}, {
  dataField: 'name',
  text: 'Product Name',
  sort: true
}, {
  dataField: 'price',
  text: 'Product Price',
  sort: true
}];

const defaultSorted = [{
  dataField: 'name',
  order: 'desc'
}];

<BootstrapTable
  keyField="id"
  data={ products }
  columns={ columns }
  defaultSortDirection="asc"
/>

What I don't understand is where to use the defaultSorted constant? Should I add it to one of my column or in the bootstraptable? I have tried different solution and none of them seems to works. Thank you for your help.

Hardik Modha
  • 12,098
  • 3
  • 36
  • 40
C0G1T0
  • 350
  • 1
  • 5
  • 17

2 Answers2

2

defaultSorted is an attribute on BootstrapTable itself. The trick here is to use the same column name for which you have 'sort: true' added.

You can have a look at a sandbox demo here.

pritam
  • 2,452
  • 1
  • 21
  • 31
0
// <BootstrapTable sort={ { columnName, order} } />

Example:

<BootstrapTable sort={ { dataField: 'firstName', order: 'desc' } } />

Make sure to give the exact column name.

bad_coder
  • 11,289
  • 20
  • 44
  • 72
Nefi
  • 1