Topic: Datatable can't sort both ways
Expected behavior It first sorts ascending when you click once and when you click again it sorts descending like it works in the example for the Datatable
Actual behavior It only sorts ascending and nothing happens when you click again
Resources (screenshots, code snippets etc.) Copy pasted and tried both the examples for 5+ and 4.27. Also tried deleting and re-installing package-lock and node_modules
Here's the google drive link to the project:
https://drive.google.com/file/d/1aQLCknvAeZRd5mSbO6JYQn6NAcxxs98G/view?usp=sharing
Edit: I'm not sure why this is being shown as an answer to the initial question, but this is NOT an answer. It's a project showing the problem described.
Piotr Glejzer staff commented 4 years ago
Try to remove <React.StrictMode/> in your App.js. I don't know why this mode is blocking sorting in another way. I added the task to check it.
rossman free commented 4 years ago
Thank you, that worked.
If your bug tracking is public, please provide a link so I can see the progress on this issue. If it's not public and you can remember, please provide an update to this forum post when the issue is resolved.
It should be noted that React.StrictMode wrapped around App is the default configuration when a new project is created using "npx create-react-app".
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.27.0
- Device: PC
- Browser: Chrome
- OS: CentOS Linux 7
- Provided sample code: No
- Provided link: No
Piotr Glejzer staff commented 4 years ago
do you have some console errors or something? I don't see this problem in my environment.
Hami123 free commented 4 years ago
No unfortunately I can't see any errors or warnings about it. I did try to set one of the columns to sort descending instead though and that did work for the first click. But when I clicked again it wasn't able to sort ascending instead. Everything else on the table works good.
Hami123 free commented 4 years ago
Here is a snippet, and that seems to work: https://mdbootstrap.com/snippets/react/hami123/2274771?action=forum_snippet#js-tab-view
When I try replacing my App.js it doesn't work though. I'm having these imports in index.js before the App import as it said in the instructions (https://www.npmjs.com/package/mdbreact):
import '@fortawesome/fontawesome-free/css/all.min.css';import 'bootstrap-css-only/css/bootstrap.min.css';import 'mdbreact/dist/css/mdb.css';
Piotr Glejzer staff commented 4 years ago
could you put your all code with this problem here?
Hami123 free commented 4 years ago
App.js is excatly the same as the code snippet above.
index.js:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
//mdbreact
import '@fortawesome/fontawesome-free/css/all.min.css';
import 'bootstrap-css-only/css/bootstrap.min.css';
import 'mdbreact/dist/css/mdb.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render( < React.StrictMode> < App /> < /React.StrictMode>, document.getElementById('root'));
// If you want your app to work offline and load faster, you can change// unregister() to register() below. Note this comes with some pitfalls.// Learn more about service workers: https://bit.ly/CRA-PWAserviceWorker.unregister();
Piotr Glejzer staff commented 4 years ago
try to remove , I don't see a problem with sorting in my apps :(
rossman free commented 4 years ago
I tried this in a test project and I have exactly the same problem. I can upload the whole react project if desired. Is there a way I can do that?
Krzysztof Wilk staff commented 4 years ago
Hi @rossman!
You can send me your react project on my e-mail k.wilk@mdbootstrap.com, I'll try to check what's wrong :)
Best regards
rossman free commented 4 years ago
@Krzysztof Wilk I just sent the project to your email. Thanks for the help.
Krzysztof Wilk staff commented 4 years ago
Hi!
I didn't get anything :/ could you resend your project into my private mail - xedanion16@gmail.com, please?
Best regards
rossman free commented 4 years ago
I sent an email to both email addresses. The email contains a link where you can download the file. Note, I got a bounceback for xedanion16@gmail.com from google. It said that the email address does not exist.