Q:

How to run a view function containing an operation parameter without reloading page

I am creating a site which allows users to post comments and like posts. I have created a view function which allows a user to like posts but am not sure how to implement ajax or a similar technique to perform the request without reloading the page. So that the user doesn't lose where they were on the page and have to scroll down to find it after liking a post. 
In my views.py:
#this is the function i wish to run without reloading
def like(request, operation, id):
    like = Post.objects.get(id=id)
    if operation == 'add':
        Like.make_like(request.user, like)
    elif operation == 'remove':
        Like.lose_like(request.user, like)
    return HttpResponseRedirect('/Feed/')

#this is the view in which it is called
class FeedView(TemplateView):
    template_name = 'feed.html'

    def get(self, request):
        form = HomeForm()
        posts = Post.objects.all().order_by('-created')
        users = User.objects.exclude(id=request.user.id)
        try:
            like = Like.objects.get(user=request.user)
            likes = like.posts.all()
        except Like.DoesNotExist:
            like = None
            likes = None
        args = {
            'form': form, 'posts': posts, 'users': users, 'likes': likes
        }
        return render(request, self.template_name, args)

    def post(self, request):
        form = HomeForm(request.POST)
        if form.is_valid():
            post = form.save(commit=False)
            post.user = request.user
            post.save()

            text = form.cleaned_data['post']
            form = HomeForm()
            return HttpResponseRedirect('/Feed/')

        args = {'form': form, 'text': text}
        return render(request, self.template_name, args)

feed.html:
    {% for post in posts %}
        <p class="name">{{ post.user.username }}</p>
        <h3>{{ post.post }}</h3>
              {% if not post in likes %}
                <li-r><a class="like" href="{% url 'like' operation='add' id=post.id %}"> {{ post.total_likes }}  </a></li-r>
              {% endif %}
              {% if post in likes %}
                <li-r><a class="unlike" href="{% url 'like' operation='remove' id=post.id %}"> {{ post.total_likes }} </a></li-r>
              {% endif %}
        <p class="date">{{ post.created }}</p>
    {% endfor %}

urls.py:
    urlpatterns = [
    url(r'^Feed/$', FeedView.as_view(), name='feed'),
    url(r'^like/(?P<operation>.+)/(?P<id>\d+)/$', views.like, name='like')
    ]

I have tried putting the function inside of the Feed class but I don't know how to write the url to include the class along with the "(?P<operation>.+)/(?P<id>\d+)" section or even if that would solve my problem. But I think I can use ajax though i have no idea how.

A:

You need to use Ajax here. Use onclick event listener on the anchor tags for like/dislike, make an ajax call instead and update the count based on the response.
$('.like, .unlike').click(function(e){
  e.preventDefault();
  var url = $(this).attr('href'));
  // make a get call on this url, and update the total_likes based on response
  $.get(url, function( data ) {
    $(this).text(data.total_likes);  //something like that
  });
});

