0

I have implemented a table using ag-grid react. I fetch data from an api to fill in that table.

const getDataForTable = async () => {
  try {
    //apis to fetch the data
    setGridData(apiData);
  }
  catch (err) {
    console.error(err);
  }
} 

useEffect(() => {
  getDataForTable();
}, []);

Now, I have also created an onClick method for deleting selected rows of the table. I am removing the rows from api as well. Once the rows are deleted, I just want to refresh the grid with updated data. Currently it only works if I explicitly reload the page.

const onClickRemoveRowsByIds = async () => {
  selectedRows.forEach(d => {
    listOfIds.push(d.Id);
  });
  if (window.confirm("Are you sure ?")) {
    await listOfIds.map((ele) => removeActiveList(ele));
    getDataForTable()
  }
}

But when I make a call to getDataForTable function, I get bad request error for the apis. On looking at the reponse body of the api : I get Invalid character found in method name. HTTP method names must be tokens. The authToken and rest of the information remains same but still fetch is not working again. Am I missing some step, or doing it completely wrong? The delete works fine, just the refresh is not happening.

9
  • Did you check your server API for why it's returning bad requests in 1st place? Commented Aug 25, 2021 at 3:14
  • What are these mutating data, like selectedRows,listOfIds? Commented Aug 25, 2021 at 3:16
  • selectedRows is a state which is updated based on the rows selected. And listOfIds is just an array Commented Aug 25, 2021 at 3:53
  • 1
    listOfIds.map() returns a new array, not sure why you have await there? If you are awaiting on removeActiveList(ele) await should be just before that. Commented Aug 25, 2021 at 3:56
  • Use a regular for loop and use await there or do like this, stackoverflow.com/questions/42489918/… Commented Aug 25, 2021 at 4:03

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.