Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DataGrid not updating Real Time Data after Field Edition. #10166

Closed
2 tasks done
5Aliens opened this issue Aug 28, 2023 · 3 comments
Closed
2 tasks done

DataGrid not updating Real Time Data after Field Edition. #10166

5Aliens opened this issue Aug 28, 2023 · 3 comments
Labels
component: data grid This is the name of the generic UI component, not the React module! status: waiting for author Issue with insufficient information

Comments

@5Aliens
Copy link

5Aliens commented Aug 28, 2023

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Steps to reproduce 🕹

Link to live example:

Steps:

  1. Retrieving live data from my server and displaying on DataGrid (Unstable_Grid2)
  2. Table is populated and I am able to change the values from my data array, it shows the correct information
  3. Have 1 editable field
  4. If I update that field the live data stops to update the table for that particular Row.

Current behavior 😯

Real time data is not update in data grid after the server data update.

Using the examples from the docs. (https://mui.com/x/api/data-grid/grid-api/)

const useFakeMutation = () => {
return React.useCallback(
(update_sell) =>
new Promise((resolve, reject) => {

    setTimeout(() => {
      console.log(update_sell.user_sell)
      if (update_sell.user_sell === '') {
        reject(new Error("Error while saving user: name can't be empty."));
      } else {
        resolve({ ...update_sell, user_sell: update_sell.user_sell });
      }
    }, 200);
  }),
[],

);
};

const mutateRow = useFakeMutation();

const processRowUpdate = React.useCallback(
async (newRow) => {
// Make the HTTP request to save in the backend

  const response = await mutateRow(newRow);
  console.log(response)
  return response;
},
[mutateRow],

);

I also can see in console that the server information is update but the DataGrid row information still with the original values (from when the user started to edit the field)

Expected behavior 🤔

Data should flow and be displayed normally.

image

Context 🔦

base information is stored at

const [properties, setProperties] = useState([]);

useEffect(() => {
setProperties(properties);
}, [update]);

and it is retrieved from the server, but the field "Sell Test" is updated at the App.

Other fields should continue to be updated normally.

Your environment 🌎

npx @mui/envinfo
  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Order ID or Support key 💳 (optional)

No response

@5Aliens 5Aliens added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Aug 28, 2023
@5Aliens
Copy link
Author

5Aliens commented Aug 28, 2023

Just adding one point. Im using value getter from params, if I get direct from my main source it works.

@zannager zannager added the component: data grid This is the name of the generic UI component, not the React module! label Aug 29, 2023
@MBilalShafi
Copy link
Member

MBilalShafi commented Aug 29, 2023

Could you provide a minimal reproduction test case with the latest version? This would help identify the issue better. 👷
A live example would be perfect. This codesandbox.io template may be a good starting point. Thank you!

P.S You don't necessarily have to provide example with real data. You can play around with dummy data and reproduce the same issue.

@MBilalShafi MBilalShafi added status: waiting for author Issue with insufficient information and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Aug 29, 2023
@github-actions
Copy link

github-actions bot commented Sep 5, 2023

The issue has been inactive for 7 days and has been automatically closed. If you think that it has been incorrectly closed, please reopen it and provide missing information (if any) or continue the last discussion.

@github-actions github-actions bot closed this as completed Sep 5, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! status: waiting for author Issue with insufficient information
Projects
None yet
Development

No branches or pull requests

3 participants