title: How to implement like/dislike button (for logged-in users) in django using AJAX
body: <p>I tried implementing Like(for those users who didn't like) and Dislike(for users who already liked the post) buttons but I could not get it to work. I tried looking some past questions but I could not solve the issue. If someone has done this before, kindly help.</p>
  
  <p>my blog/models.py for Post model</p>
  
  <pre><code>class Post(models.Model):
      author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
      title = models.CharField(max_length=200)
      text = models.TextField()
      likes = models.ManyToManyField(User, related_name='likes', blank=True)
      created_date = models.DateTimeField(default=timezone.now)
      published_date = models.DateTimeField(blank=True, null=True)
  
      def total_likes(self):
          return self.likes.count()
  </code></pre>
  
  <p>my blog/views.py </p>
  
  <pre><code>def post_detail(request, pk):
      post = get_object_or_404(Post, pk=pk)
      is_liked = False
      if post.likes.filter(id=request.user.id).exists():
          is_liked = True
      return render(request, 'blog/post_detail.html', {'post': post, 'is_liked': is_liked, 'total_likes': post.total_likes(), })
  
  def like_post(request):
      post = get_object_or_404(Post, id=request.POST.get('id'))
      is_liked = False
      if post.likes.filter(id=request.user.id).exists():
          post.likes.remove(request.user)
          is_liked = False
      else:
          post.likes.add(request.user)
          is_liked = True
      context = {
          'post': post,
          'is_liked': is_liked,
          'total_likes': post.total_likes(),
      }
      if request.is_ajax():
          html = render_to_string('blog/like_section.html', context, request=request)
          return JsonResponse({'form': html})
  </code></pre>
  
  <p>my HTML and AJAX code (this section is present in post_detail.html)</p>
  
  <pre><code>    &lt;div id="like-section"&gt;
          {% include 'blog/like_section.html' %}
      &lt;/div&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascirpt"&gt;
          $('#like').click(function(){
              var pk = $(this).attr('value');
              $.ajax({
                  type: 'POST',
                  url: "like_post",
                  data: {
                      'id':pk,
                  },
                  success: function(response){
                      $('#like-section').html(response['form'])
                  },
              });
          });
      &lt;/script&gt;
  </code></pre>
  
  <p>like-section.html is a separate template :-</p>
  
  <pre><code>&lt;p&gt;{{ total_likes }} Like{{ total_likes|pluralize }}&lt;/p&gt;
  {% if request.user.is_authenticated %}
  &lt;form action="{% url 'like_post' %}" method="post"&gt;
      {% csrf_token %}
      {% if is_liked %}
          &lt;button type="submit" id="like" name="post_id" value="{{ post.id }}" class="btn btn-danger"&gt;Dislike&lt;/button&gt;
      {% else %}
          &lt;button type="submit" id="like" name="post_id" value="{{ post.id }}" class="btn btn-primary"&gt;Like&lt;/button&gt;
      {% endif %}
  &lt;/form&gt;
  {% endif %}
  </code></pre>
  
  <p>my main project folders urls.py code :-</p>
  
  <pre><code>urlpatterns = [
      path('admin/', admin.site.urls),
      path('accounts/login/', auth_views.LoginView.as_view(), name='login'),
      path('accounts/logout/', auth_views.LogoutView.as_view(next_page='/'), name='logout'),
      path('', include('blog.urls')),
  ]
  </code></pre>
  
  <p>my blog app's urls.py code :-</p>
  
  <pre><code>urlpatterns = [
      path('', views.post_list, name='post_list'),
      path('post/&lt;int:pk&gt;/', views.post_detail, name='post_detail'),
      path('post/new/', views.post_new, name='post_new'),
      path('post/&lt;int:pk&gt;/edit/', views.post_edit, name='post_edit'),
      path('drafts/', views.post_draft_list, name='post_draft_list'),
      path('post/&lt;pk&gt;/publish/', views.post_publish, name='post_publish'),
      path('post/&lt;pk&gt;/remove/', views.post_remove, name='post_remove'),
      path('post/&lt;int:pk&gt;/comment/', views.add_comment_to_post, name='add_comment_to_post'),
      path('comment/&lt;int:pk&gt;/approve/', views.comment_approve, name='comment_approve'),
      path('comment/&lt;int:pk&gt;/remove/', views.comment_remove, name='comment_remove'),
      path('like/', views.like_post, name="like_post"),
  ]
  </code></pre>
  
  <p>Screenshot of the directories
  <a href="https://i.stack.imgur.com/x5kGI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/x5kGI.png" alt="enter image description here"></a></p>
  
  <p>Now, the error which I am getting on running this on localhost :-
  <a href="https://i.stack.imgur.com/ilj5B.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ilj5B.png" alt="enter image description here"></a></p>