Django 使用 Ajax 创建评论系统答案

【问题标题】：Django creating Comment System with AjaxDjango 使用 Ajax 创建评论系统
【发布时间】：2019-02-23 08:54:38
【问题描述】：

我想为我的页面创建一个评论系统。该系统应该可以在不刷新页面的情况下工作。我是 Ajax 的新手，我可能遗漏了一些东西，但我不知道是什么。当我点击“评论”按钮时，页面显示类似;

我的代码：

view.py

def post_detail(request, pk, ):
    post = get_object_or_404(Post, pk=pk)
    form = CommentForm(request.POST or None)
    if form.is_valid():
        name = request.POST['name']
        content = request.POST['content']
        comment = Comment()
        comment.name = name
        comment.content= content
        return JsonResponse(model_to_dict(comment), safe=False)
    context = {
        'post': post,
        'form': form,
    }
    return render(request, 'blog/post_detail.html', context)

models.py

class Comment(models.Model):
    name = models.CharField(max_length=200, verbose_name='name')
    content = models.TextField(verbose_name='comment')
    created_date = models.DateTimeField(auto_now_add=True)

comment.html

    {% load crispy_forms_tags %}

<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>

post_detail.html

...     
    <div id="comment">
    <h2>Yorum Ekle:</h2>
    {% 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 %}
</div>
<hr>
<hr>
<script type="text/javascript" src="{% static 'js/jquery-1.11.1.min.js' %}"></script>
<script type="text/javascript">

    $(document).ready(function () {
        $("#comment|form").submit(function (e) {
            e.preventDefault();
            var url = "/post/12";
            $.ajax({
                type: 'POST',
                url: url,
                data: $("#comment_form").serializeArray(),
                success: function (data) {
                    console.log('SUCCESS');

                }
            });
        });
    });
</script>

forms.py `

class CommentForm(forms.ModelForm):
    class Meta:
        model = Comment
        fields = [
            'name',
            'content',

        ]

我的错误是什么，我该如何解决？请帮我。感谢您的关注。

【问题讨论】：

您还没有告诉我们究竟出了什么问题，那么我们如何诊断问题呢？您期望什么输出以及遇到什么错误？
@Jode 我发布了一个答案，但如果这不是您遇到的唯一问题，我们将需要有关您的问题的更多信息。

标签： python json ajax django

【解决方案1】：

您的选择器语法有问题：

$(document).ready(function () {
    $("#comment|form").submit(function (e) {
        ...

$("#comment|form") 在您的 post_detail.html 文件中应改为 $("#comment_form")。

【讨论】：