Django json-ответ остается на той же странице

Я делаю кнопку like для поста в django. Мне нужно, чтобы при нажатии на кнопку like выполнялась функция, но чтобы страница не перезагружалась (чтобы потом использовать javascript). Для этого я возвращаю jsonresponse() вместо return render. Но настоящая проблема в том, что она перенаправляет меня на страницу, которую я показываю на фотографии. Страница не перезагружается. как я хочу. но я не хочу, чтобы она показывала мне пустую страницу с данными jsonresponse (как на этой фотографии). Я хочу оставаться на той же странице без перезагрузки.

What I get

Моя функция просмотра:

def liking (request, pk):

posts = get_object_or_404(Post, id = pk)
if request.user in posts.likes.all():
    posts.likes.remove(request.user)
else:    
    posts.likes.add(request.user.id)
    
    
likes_count = posts.likes.all().count()
print(f'likes_count = {likes_count}')
data= {
    'likes_count': likes_count,
}
#return redirect ('index')# This is commented


return JsonResponse(data, safe=False, status=200 )

Вы можете использовать AJAX. Просто поместите приведенный ниже код в шаблон и запустите его с помощью кнопок.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
    function get_likes(pk){
        $.ajax({
            url: '{% url "url-name" pk %}',
            type: 'GET',
            success: function (res) {
                var likes = JSON.parse(res);
                return likes["likes_count"]
            }
        });
    }
</script>

Если вам нужно разместить какие-либо данные, вы можете использовать строки ниже.

function get_likes(pk){
    $.ajax({
        url: '{% url "url-name" pk %}',
        type: 'POST',
        data: { 
            csrfmiddlewaretoken: "{{ csrf_token }}",
            data1:"data",
            data2:"data"
        },
        success: function (res) {
            var likes = JSON.parse(res);
            return likes["likes_count"]
        }
    });
}

Вы можете добавить следующие строки в свою функцию, чтобы использовать опубликованные данные на стороне django.

data1 = request.POST.get("data1")
data2 = request.POST.get("data2")

После некоторого времени попыток я нашел проблему. Это не имело никакого отношения к ajax-запросу или fetch, что я в итоге и использовал. Просто у меня был url функции views.py в href="" и по этой причине появился белый экран с данными jsonresponse():

Мне пришлось измениться: 

<a class="btn btn-dark like" id="like_button" href="{% url 'liking'  post.id %}"> Like</a>

Со:

<a class="btn btn-dark like" id="like_button" href="#"> Like</a>

Спасибо за все ответы!

Вернуться на верх