首页 > 解决方案 > Django Ajax 评论系统

问题描述

我想使用 Ajax 创建一个评论系统。我的主要目的是在我的页面中获得新评论而不刷新页面。我在我的 HTML 文件中添加了一些 js 代码,但它不起作用。我的错误在哪里,我该怎么办?

视图.py

    ...
def post_detail(request, pk, ):
    post = get_object_or_404(Post, pk=pk)
    form = CommentForm(request.POST or None)
    if form.is_valid():
        comment = form.save(commit=False)
        comment.post = post
        comment.save()
        return redirect('post_detail', pk=post.pk)
    context = {
        'post': post,
        'form': form,
    }

    return render(request, 'blog/post_detail.html', context)

评论.html

    {% load crispy_forms_tags %}
{% load static %}
<hr>
<form method="POST" style="width: 50%; margin-left: 20px" id="comment_form">
    {% csrf_token %}
    {{ form|crispy }}
    <input type="submit" class="btn btn-info" value="Yorum Ekle" style="margin-left: 20px">
</form>

<script type="text/javascript" src="{% static 'js/jquery-1.11.1.min.js' %}"></script>

<script type="text/javascript">

    $(document).on('submit', '#comment_form', function (e) {
        e.preventDefault();
        $.ajax({

                type: 'POST',
                url: 'http://127.0.0.1:8000/post/12/', 
                data: {
                    name: $('#name').val(),
                    content: $('#content').val(),
                    created_date: $('#created_date').val(),
                    post: $('#post').val(),
                    csrfToken: $('input[name=csrfmiddlewaretoken]').val()
                },
                success: function () {
                    alert("YEAH! It works!");

                }
           }
        )
    })
</script>

post_detail.html

...

    {% include 'blog/comment.html' %}
        <hr>
        {% for comment in post.comments.all %}

            <h4>{{ comment.name }} | <small>{{ comment.created_date|timesince }} önce</small></h4>
            <p>{{ comment.content|linebreaks }}</p>
        {% endfor %}

网址.py

...
        url(r'^post/(?P<pk>\d+)/$', views.post_detail, name='post_detail'),

当我单击评论按钮时,没有任何动作。但是当我查看检查元素时,当我单击按钮时,它显示状态码:403

注意:我得到“是的!它有效!” 警报

标签: pythondjango

解决方案


您需要在 post_detail 方法中返回 JsonResponse 或部分模板,以便您可以在 ajax 成功函数中使用这些数据。我创建了一个 django 应用程序,用于使用 ajax 响应来防止页面刷新的评论系统。如果你有兴趣这里的包回购


推荐阅读