Django Ajax как кнопка для записи

Question

Я пытаюсь создать кнопку «Мне нравится», например, приложения для социальных сетей, где пользователю нравится кнопка в сообщении, а затем кнопка меняется, однако моя кнопка не меняется, но количество лайков меняется. Я использую ajax.

в своем шаблоне списка сообщений. Я добавляю следующую форму:

<div id="like-section">
  {% include 'home/posts/likes.html' with post=post %}
</div>

Мои лайки. html:

{% if request.user.is_authenticated %}
<form action="{% url 'home:post-like' post.id %}" method="POST">
    {% csrf_token %}
    {% if post.is_liked  %}
        <button type="submit" id="likeBtn" data-url="{% url 'home:post-like' post.id %}" data-token="{{ csrf_token }}" name="post_id" value="{{ post.id }}" class="btn btn-sm">
            <span class="text-primary">
                <i class="fas fa-thumbs-down"></i> {{ post.likes.count }}
            </span>
        </button>
    {% else %}
        <button type="submit" id="likeBtn" data-url="{% url 'home:post-like' post.id %}" data-token="{{ csrf_token }}" name="post_id" value="{{ post.id }}" class="btn btn-sm">
            <span class="text-primary">
                <i class="fas fa-thumbs-up"></i> {{ post.likes.count }}
            </span>
        </button>
    {% endif %}
</form>
{% endif %}

мой взгляд:

@login_required
def post_like(request,id):
    data = dict()
    post = get_object_or_404(Post, id=id)
    user = request.user
    if post.likes.filter(id=user.id).exists():
        post.likes.remove(user)
    else:
        post.likes.add(user)
    data['form_is_valid'] = True
    posts = Post.objects.all()
    posts = Post.objects.order_by('-last_edited')
    data['html'] = render_to_string('home/posts/home_post.html',{'posts':posts},request=request)
    return JsonResponse(data)

мой javascript код:

$(document).ready(function (e) {
    $(document).on("click", "#likeBtn", function (e) {
        e.preventDefault();
        var pk = $(this).attr("value");
        var tk = $(this).attr("data-token")
        $.ajax({
            type: "POST",
            dataType: 'json',
            url: $(this).attr("data-url"),
            data: {'id':pk, 'csrfmiddlewaretoken': tk},        
            success: function (data){
                $("#post-list div").html(data.html)
            },
            error: function(rs, e){
                console.log(rs.responeText);
            },
        });
    });
})

и в моей почтовой модели у меня есть эта функция:

def is_liked(self, request):
    return self.likes.filter(id=request.user.id).exists()

Но когда пользователь нажимает кнопку «Мне нравится», она не превращается в кнопку «Мне не нравится». Тем не менее, я вижу, что представление работает без ошибок. Мне было интересно, если проблема связана с моим ajax запросом.

Заранее спасибо!

РЕДАКТИРОВАТЬ:

Так что мне удалось решить эту проблему Вопрос, однако, я не знаю, если это правильный способ сделать это. Прямо сейчас мое мнение:

@login_required
def post_like(request,id):
    data = dict()
    post = get_object_or_404(Post, id=id)
    user = request.user
    if post.likes.filter(id=user.id).exists():
        post.likes.remove(user)
    else:
        post.likes.add(user)

    posts = Post.objects.all()
    posts = Post.objects.order_by('-last_edited')
    data['html'] = render_to_string('home/posts/home_post.html',{'posts':posts},request=request)
    return JsonResponse(data)

и мои лайки, html file is:

{% if request.user.is_authenticated %}
<form action="{% url 'home:post-like' post.id %}" method="POST">
    {% csrf_token %}
    {% if request.user in post.likes.all %}
        <button type="submit" id="likeBtn" data-url="{% url 'home:post-like' post.id %}" data-token="{{ csrf_token }}" name="post_id" value="{{ post.id }}" class="btn btn-sm">
            <span class="text-primary">
                <i class="fas fa-thumbs-down"></i> {{ post.likes.count }}
            </span>
        </button>
    {% else %}
        <button type="submit" id="likeBtn" data-url="{% url 'home:post-like' post.id %}" data-token="{{ csrf_token }}" name="post_id" value="{{ post.id }}" class="btn btn-sm">
            <span class="text-primary">
                <i class="fas fa-thumbs-up"></i> {{ post.likes.count }}
            </span>
        </button>
    {% endif %}
</form>
{% endif %}

В данный момент проблема заключается в том, что теперь я не могу видеть детали сообщения, если я не переосмыслил sh страница, я не знаю, в чем проблема, как я могу это исправить? В основном, все мои функции для объекта post не будут работать, если я не перефразирую sh страницу