1👍
I think the very first comment by Sayse gives your answer. I am just trying to give a bit more explanation.
So What you have done is after a successful ajax request, you replace existing like count with the data you get from ajax in any the element who have a class named .like_count
.
Check In your code $('.like_count').html(data);
This select all the elemnt having like_count
class and change the html.
Instead, what you should’ve done is after a successful ajax, change the data only in one place. You need to choose appropriate jquery selector.
Something like .closest()
can be used. In that case, use (following code is not tested) $(this).closest('.like_count').html(data);
to apeend ‘like count’ in appropriate element.
Also you can assign dynamic ID to each ‘like count’ element based on id and then use exect ID Selector.
Hope this helps.
Cheers!
1👍
Did you say:
but after the page refresh that is okay
Since your code snippet works, you’re simply looking for the likes count incrementation to happen and see the live update in the template.
Well, in theory, here:
- The function that increments the like should return with a JSON response of the incremented value from the database.
- A client function standing by accepts this JSON response, and updates the template value accordingly.
In Practicals:
- See this answer: https://stackoverflow.com/a/31832275/1757321