Question

I want to implement a ajax ‘like’ button which should increase the like count and not refresh the whole page. I am new to ajax so please help.

urls.py:

(r'^like/(\d+)/$',like),

Below is my views code for like:

def like(request,feedno):
  feed=Feed.objects.get(pk=feedno)
  t=request.META['REMOTE_ADDR']
  feed.add_vote(t,+1)
  vote, created = Vote.objects.get_or_create(

          feed=feed,
          ip=t,
          )

  feed.likecount+=1
  feed.save()
  if 'HTTP_REFERER' in request.META:
    return HttpResponseRedirect(request.META['HTTP_REFERER'])
  return HttpResponseRedirect('/')

Below is my html(like div):

<div class="like_abuse_box">
  <p>Likes:<b>{{vote.feed_set.count}}</b> ||
   <a class="like" href="/like/{{feed.id}}/">Like</a> | 
   <a class="abuse" href="/abuse/{{feed.id}}/">Abuse</a> || </p>
</div>

What code should I include to only refresh that particular div and updated like count be shown without the whole page getting reloaded. Need Help. Thanks.

Answer 1

Haven’t tested it athough something like that should work. Edit: tested and works, now for multiple elements on a webapage

Javascript

$("a.like").click(function(){
    var curr_elem = $(this) ;
    $.get($(this).attr('href'), function(data){
        var my_div = $(curr_elem).parent().find("b");
        my_div.text(my_div.text()*1+1);     
    }); 
    return false; // prevent loading URL from href
});

Django view

You can add if request is Ajax with:

if request.is_ajax():