Question

我正尝试取消我的评论表格，以便可以在不刷新页面的情况下提交它。我有一个Comment模型，它具有Post模型的ForeignKey：

class Comment(models.Model):
    user = models.ForeignKey(Profile, on_delete=models.CASCADE)
    post = models.ForeignKey(Post, on_delete=models.CASCADE)
    body = models.TextField(max_length=500)
    updated = models.DateTimeField(auto_now=True)
    created = models.DateTimeField(auto_now_add=True)

class Post(models.Model):
    content = models.TextField()
    updated = models.DateTimeField(auto_now=True)
    created = models.DateTimeField(auto_now_add=True)
    author = models.ForeignKey(Profile, on_delete=models.CASCADE, related_name='posts')

这是我的模板：

{% for post in posts %}
    ...
    <div id="comList"">
        {% if post.comment_set.all %}
            {% for c in post.comment_set.all %}
                <p>{{ c.body }}</p>
            {% endfor %}
        {% endif %}
    </div>

    <form id="addComForm" action="{% url 'posts:comment' %}" method="post">
        {% csrf_token %}
        <input type="hidden" name="post_id" value={{ post.id }}>
        {{ c_form }}
        <button id="addComBtn" type="submit" name="submit_c_form">Send</button>
    </form>
{% endfor %}

<script>
    $(document).ready(function() {

        $('#addComBtn').click(function() {
            var serializedData = $('#addComForm').serialize();
            const url = $('#addComForm').attr('action')

            $.ajax({
                url: url,
                data: serializedData,
                type: 'POST',
                success: function(response) {
                    $('#comList').append('<p>' + response.c.body + '</p>')
                },
                error: function(error) {
                    console.log(error)
                }
            })
        });
    });
</script>

这是我的观点：

def comment_view(request):
    profile = Profile.objects.get(user=request.user)

    if 'submit_c_form' in request.POST:
        c_form = CommentModelForm(request.POST)
        if c_form.is_valid():
            instance = c_form.save(commit=False)
            instance.user = profile
            instance.post = Post.objects.get(id=request.POST.get('post_id'))
            instance.save()
            return JsonResponse({'comment': model_to_dict(instance)}, status=200)

    return redirect('posts:index')

供参考，我的表格和相关网址：

class CommentModelForm(forms.ModelForm):
    class Meta:
        model = Comment
        fields = ('body',)

path('comment/', comment_view, name='comment'),

当前提交后，我在控制台中得到Uncaught TypeError: response.c is undefined，所以我认为问题出在视图的JsonResponse中。在此方面获得的任何帮助将不胜感激

使用Ajax和Django添加评论

0 个答案: