Click here to Skip to main content
15,867,594 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hello,

I'm having an issue with my Front-end/ back-end "communication".
Basically I am developing a software that take some data from local folders (through express readDir method), then from this data I filtered, created arrays and return a json.
The client request the data in app.js with fetch () and with app.get of express I take these data and basically I fullfill a table with javascript:

app.get("/data",(req,res)=>{
      res.json({
          status:'success',
          headers:data.headers,
          rows:data.rows,
          lastUpdated: new Date().toISOString(),    
      });


The table is created in HTML but take the data from a data-url:

<div class="table-refresh" data-url="/data">

and it is structured and filled in the app.js file:


for (const row of datas.rows){

}
.... and the same for headers....

Here how the data is requested from frontend :

const table = root.querySelector(".table-refresh__table");
        const response = await fetch(root.dataset.url)
        const datas = await response.json()


Now, the real problem is that the software works at first launch npm run start.... I would like to change these data everytime that I click a specific button, that should eventually refresh and reload all the code with the new contents. In my case the button is triggered, the arrays are working and updated correctly in the backend but when I try to do call again the frontend to pass the new data (with the /data endpoint as before) in order to update the table, it seems that the response remain the same i.e. the contents of the json arrays didnt't change and the table on the frontend neither of course.

Also the refresh button I tried to implement didn't work with the contents update

options.querySelector(".table-refresh__button").addEventListener("click", () =>{
         updateTable(root);
         });



I have the doubt that I'm not doing good with the "communication" of the data from client to server and consequentially with the table refresh.

Hope that I explain the problem properly and without the confusion that I am having at the moment.

What I have tried:

Tried different fetch method to get data updated, even if it's not the best practice...

Tried setTimeout() method and then relaunch

Tried to add a refreshButton to load new data
Posted
Updated 4-Oct-22 6:53am
v2

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900