0
407
ViewsCoreUI DataTable sort values by specific column values
Right now, it's not showing sorted result according to title. I want to show the rows by default in ascending.
Please have a look:
Below is my code:
const fields = [
{ key: 'title', _classes: 'font-weight-bold' },
{ key: 'category', _style: { width: '20%'} }
]
<CDataTable
items={list}
fields={fields}
columnFilter
tableFilter={{ 'placeholder': 'Type something...'}}
itemsPerPageSelect
itemsPerPage={5}
hover
sorter
pagination
/>
Note: From the Documentation: I have tried something i.e. sorter={{'resetable': 'ascending'}} but nothing works for me.
·
Juan Pablo Isaza
2 answers
Answer question0
There's two points:
- For descending sort you must set
asc:false - Default sort value must pass to
sorterValueoption inCDataTable
So , you can try this:
<CDataTable
items={list}
fields={fields}
columnFilter
tableFilter={{ 'placeholder': 'Type something...'}}
itemsPerPageSelect
itemsPerPage={5}
hover
sorter
sorterValue={{column: "title", asc: true}}
pagination
/>
·
Juan Pablo Isaza
Report
0
Here is how it works for me:
<CDataTable
items={list}
fields={fields}
columnFilter
tableFilter={{ 'placeholder': 'Type something...'}}
itemsPerPageSelect
itemsPerPage={5}
hover
sorter
sorterValue={{column: "title", asc: true}}
onSorterValueChange={(params) => {
if (params.column === order.sorting.column && params.asc === order.sorting.asc) return;
dispatch(actions.getOrders(.....));
dispatch(actions.sortingChanged(params));
}}
pagination
/>
You should avoid cyclic code call by making sure in onSorterValueChange() that params.column & params.asc are not equal to what is already set. If true - return; otherwise - call your API request and change state with new sorting params.
·
Juan Pablo Isaza
Report
Answer question