javascript - 将评论加载到页面而不刷新

问题描述

我是 JS 新手，我正在尝试学习在不刷新页面的情况下向帖子添加评论的步骤。所以，到目前为止，我成功地使用 JS 加载 Like 按钮，而无需按照教程进行刷新，但我需要一些关于评论的帮助。

这是评论view.py

class PostDetailView(DetailView):
    model = Post
    template_name = "blog/post_detail.html"  # <app>/<model>_<viewtype>.html

    def get_context_data(self, *args, **kwargs):
        context = super(PostDetailView, self).get_context_data()
        post = get_object_or_404(Post, slug=self.kwargs['slug'])
        comments = Comment.objects.filter(
            post=post).order_by('-id')

        if self.request.method == 'POST':
            comment_form = CommentForm(self.request.POST or None)
            if comment_form.is_valid():
                content = self.request.POST.get('content')
                comment_qs = None

                comment = Comment.objects.create(
                    post=post, user=self.request.user, content=content)
                comment.save()
                return HttpResponseRedirect("blog/post_detail.html")
        else:
            comment_form = CommentForm()

        context["comments"] = comments
        context["comment_form"] = comment_form
        return context

    def get(self, request, *args, **kwargs):
        res = super().get(request, *args, **kwargs)
        self.object.incrementViewCount()
        return res

class PostCommentCreateView(LoginRequiredMixin, CreateView):
    model = Comment
    form_class = CommentForm

    def form_valid(self, form):
        post = get_object_or_404(Post, slug=self.kwargs['slug'])
        form.instance.user = self.request.user
        form.instance.post = post
        return super().form_valid(form)

    def form_invalid(self, form):
        return HttpResponseRedirect(self.get_success_url())

    def get_success_url(self):
        return reverse('blog:post-detail', kwargs=dict(slug=self.kwargs['slug']))

这是模板：

           <legend class="border-bottom mb-0"></legend>
                {{comments.count}} Comment{{comments|pluralize}}

            <div class="container-fluid mt-2">
                <div class="form-group row">

                    <form action="{% url 'blog:post-comment' post.slug %}" method="post" class="comment-form" action=".">
                    {% csrf_token %}
                    {{ comment_form.as_p }}
                    <input type="hidden" name="post_id" value='{{post.id}}' class="btn btn-outline-success">
                    <button type="submit" class="btn btn-outline-success">Submit</button>
                    </form>

                </div>
            </div>

                <button class="cmt_btn ui button mb-5">show / hide comments</button>
                <div class="comment-box">
                    {% for comment in comments %}
                    <blockquote class="blockquote" style="border-left: .25rem solid #757f95;">
                        <small><p class="mb-0"> {{ comment.content}}</p></small>
                        <footer class="blockquote-footer">by<cite title="Source Title">{{comment.user| capfirst}}</cite></footer>
                    </blockquote>

                {% endfor %}

谢谢

标签： javascriptpythondjangoajax

javascript - 将评论加载到页面而不刷新

问题描述

解决方案

推荐阅读