Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to disable default sorting in React Admin?

I have simple question

Is it possible to disable default sorting by column id? Or at least change it globally?

Thanks for answer

EDIT:

To be more specific, I have REST API (OData) which returns "Id" instead of "id" so I have to set sort everytime I use related component to prevent undefined errors.

I would welcome option to disable default sort in related components.

like image 516
Allwe Avatar asked Jan 07 '19 16:01

Allwe


People also ask

How do I filter list in react-admin?

React-admin uses the filter query parameter from the URL to determine the filters to apply to the list. To change the filters, react-admin simply changes this filter query parameter, and the <List> components fetches dataProvider. getList() again with the new filters.

How does react-admin work?

React-admin runs in the browser, and relies on data it fetches from APIs. JSONPlaceholder provides endpoints for users, posts, and comments. The admin we'll build should allow to Create, Retrieve, Update, and Delete (CRUD) these resources.

What is sorting in react JS?

The Grid component supports sorting data by one or several column values. Use the corresponding plugins and UI (column headers and Group Panel) to manage the sorting state and sort data programmatically. Click several columns while holding Shift to sort data by these columns.


1 Answers

If you are looking for a solution to disable sort option for that column, you can use sortable={false}.

Example usage:

import React from 'react';
import { List, Datagrid, TextField } from 'react-admin';

export const PostList = (props) => (
<List {...props}>
    <Datagrid>
        <TextField source="id" sortable={false} />
        <TextField source="title" />
        <TextField source="body" />
    </Datagrid>
</List>
);

Or you can specify a default sort for the List.

export const PostList = (props) => (
    <List {...props} sort={{ field: 'published_at', order: 'DESC' }}>
    ...
    </List>
);
like image 197
selens Avatar answered Sep 18 '22 21:09

selens