Trouble with defaultSorted and React Bootstrap table Next

Question

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.

pritam · Accepted Answer · 2019-04-26 16:27:11Z

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.

answered Apr 26, 2019 at 16:27

pritam

2,5561 gold badge22 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

bad_coder · Accepted Answer · 2021-09-13 20:13:42Z

1

// <BootstrapTable sort={ { columnName, order} } />

Example:

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

Make sure to give the exact column name.

edited Sep 13, 2021 at 20:13

bad_coder

13.2k20 gold badges59 silver badges95 bronze badges

answered Sep 13, 2021 at 16:42

Nefi

111 bronze badge

1 Comment

Salim Shamim Over a year ago

Any idea, if it will work if the field is a date field ?

Collectives™ on Stack Overflow

Trouble with defaultSorted and React Bootstrap table Next

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related