Data changes in DB but not reflecting in UI sometimes

Hey guys, sometimes when I insert a data or update a data the page requires another refresh to change the UI. We know that when we change a data the page will reload so it should reflect right?. Not every time, sometimes it do reflect. I was wondering why.
I was deleted a data which is successful and that doesn’t removed from UI so that people might click again to delete which will cause error because it’s already deleted.
It happens when deleting or updating a data and return back
Am i doing anything wrong or any fix?

In similar situations, the best you can do is to be perseverant in debugging.
I suspect the problem may lay on your front-end code, but the backend code can also be guilty. Hard to guess without actual code.

Perhaps you have the results being cached before? So it’s not reflected correctly

Can you share some code of your controller, that performs updates/deletes? I suspect the browser cache is triggering this.

@virk @begueradj
Here’s my code
Controller:

   const req = request.all();
   const rules = {
     list: "required|min:6"
   };
   const messages = {
     "list.required": "List field is needed",
     "list.min": "Minimum 6 char"
   };
   const validation = await validate(req, rules, messages);
   if (validation.fails()) {
     session.withErrors(validation.messages()).flashAll();
     return response.redirect("back");
   }
   const list = await List.find(params.id);
   list.list = req.list;
   list.save();
   session.flash({ success: "Edited successfully" });
   return response.redirect("/lists");
 } ```  

passing to view with another method

const data = await List.all();
return view.render(“lists”, { data: data.toJSON() })


In lists view : 
  @each(list in data)
        <p> {{ list.list }} </p>
   @endeach

I use chrome browser

you should use await while saving.
await list.save()

2 Likes

I don’t think that’s the issue. I think i resolved the promise when I do await List.find(). Thing is it worked as expected but problem is with UI.

I think i resolved the promise when I do await List.find().

But save() is a different asynchronous operation, you should await for it as suggested by @BatuhanK

Sure will do that