Как отключить перенаправление при нажатии на кнопку? Django

Я пытаюсь создать кнопку like для моей страницы. все в порядке, она работает, но когда я нажимаю на кнопку, страница обновляется. Когда я нажимаю на кнопку like, я хочу, чтобы счетчик, показывающий количество лайков, увеличивался. Я пытался использовать Ajax, но у меня не получилось. Вот мои коды...

Просмотров:

def liked_post(request,pk):
   post =get_object_or_404(UserPosts, id=request.POST.get("userposts_id"))
   liked = False
   if post.like_post.filter(id = request.user.id).exists():
       post.like_post.remove(request.user)
       liked = False
   else:
       post.like_post.add(request.user)
       liked = True

   return HttpResponseRedirect(reverse('detail', args=[str(pk)] ))

def detail_post(request,_detail):
   postDetail =  UserPosts.objects.get(pk = _detail)
   liked = False
   if postDetail.like_post.filter(id= request.user.id).exists():
       liked = True
   context= {
      "detail":postDetail,
      "liked":liked
   }
   return render(request,"DetailPost.html",context)

Файл Javascript:

$(document).ready(function () {
 //like ajax call
 $('.like-form').submit(function (e) {
 e.preventDefault();
 const userposts_id = $('.like-btn').val();
 const token = $('input[name=csrfmiddlewaretoken]').val();
 const url = $(this).attr('action')
 $.ajax({
    method: "POST",
    url: url,
    headers: { 'X-CSRFToken': token },
    data: {
    'userposts_id': userposts_id
      }
    })
  })
})

Шаблон:

 <form class="btn-group  mt-1 like-form" action="{% url 'like_post' detail.pk %}"                                
                      method="POST">
     {% csrf_token %}
     {% if request.user.is_authenticated %}
         {% if detail.username_id == request.user.id %}
               <button class="btn btn-primary btn-sm" disabled>Like</button>
         {% else %}
               {% if liked %}
                   <button class="btn btn-danger btn-sm " type="submit" name="userposts_id"                                      
                                    value="{{ detail.id }}">Unlike</button>
      {% else %}
           <button class="btn btn-primary btn-sm like-btn"
                 type="submit" name="userposts_id" value="{{ detail.id }}">Like</button>
      {% endif %}
      {% endif %}
               {% else %}
                   <span class="px-2 pt-1">
                           <a href="{% url 'login' %}" class="">Login</a> to like
                   </span>
      {% endif %}
      <span class="bg-dark px-4 pt-1  like-count text-white"> {{total_post_likes}}</span>
</form>

У кого-нибудь есть идея?

def liked_post(request):
    if request.is_ajax():
        pk = request.POST.get('userposts_id')
        post = get_object_or_404(UserPosts,id=pk)
        if request.user in post.like_post.all():
            liked = False
            post.like_post.remove(request.user)
        else:
            liked = True
            post.liked.add(request.user)
        return JsonResponse({'liked': liked, 'count': post.like_post.count()})
    return redirect('detail')

 <span class="bg-dark px-4 pt-1  like-count text-white"> {{total_post_likes}}</span>

$.ajax({
  type: "GET",
  url: url,
  success: function (response) {
      console.log(response) //response will be what you send in jsonresponse in django view
   $('.like-count').innerHtml =`${response.count}`
    }
})