ajax 注释,将Ajax添加到注释部分不起作用

我正在尝试将Ajax添加到我的评论部分,以避免每次添加评论时页面刷新。

因此,我将注释部分从新的comments.html加载到post-details.html,并按照实现的Ajax进行发布,但是我的问题是它没有任何效果,并且页面需要刷新以显示新评论

我在views.py中对Generic DetailView类进行了子类化,并试图根据URL中接收到的参数找出一种以JSON格式返回数据的方法。这是我尝试做的事情:

class PostDetailView(DetailView):

model = Post

template_name = "blog/post_detail.html" # /_.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')

total_likes = post.total_likes()

liked = False

if post.likes.filter(id=self.request.user.id).exists():

liked = True

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

context["total_likes"] = total_likes

context["liked"] = liked

if self.request.is_ajax():

html = render_to_string('blog/comments.html', context, request=self.request)

return JsonResponse({'form': html})

else:

return context

但这给了我TypeError应该是:

TypeError: context must be a dict rather than JsonResponse.

这是回溯:

Traceback (most recent call last):

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\core\handlers\exception.py", line 47, in inner

response = get_response(request)

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\core\handlers\base.py", line 202, in _get_response

response = response.render()

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\template\response.py", line 105, in render

self.content = self.rendered_content

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\template\response.py", line 83, in rendered_content

return template.render(context, self._request)

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\template\backends\django.py", line 59, in render

context = make_context(context, request, autoescape=self.backend.engine.autoescape)

File "C:\Users\User\Desktop\Project\venv\lib\site-packages\django\template\context.py", line 268, in make_context

raise TypeError('context must be a dict rather than %s.' % context.__class__.__name__)

在控制台中,我收到此错误:

GET http://127.0.0.1:8000/blog/blog-4/ 500 (Internal Server Error) jquery.min.js:2

这是评论部分:

{% csrf_token %}

{{ comment_form.as_p }}

Show / Hide {{comments.count}} Comment{{comments|pluralize}}

{% for comment in comments %}

  • %7B%7B%20comment.post.author.profile.image.url%20%7D%7D

    {{comment.user| capfirst}}- {{ comment.created}}

    {% if comment.user == user %}

    {% endif %}

    {{ comment.content}}

{% endfor %}

这是脚本

$(document).on('submit', '.comment-form', function(event){

event.preventDefault();

console.log($(this).serialize());

$.ajax({

type: 'POST',

url: $(this).attr('action'),

data: $(this).serialize(),

dataType: 'json',

success: function(response) {

$('.main-comment-section').html(response['form']);

$('textarea').val('');

},

error: function(rs, e) {

console.log(rs.responseText);

},

});

});

我的问题是:

收到此错误的原因是什么,我该如何解决?

解决方案

该功能get_context_data仅用于为不处理ajax请求的上下文构建数据。您需要拆分功能以提供对GET数据的处理

示例结构

class PostDetailView(DetailView):

model = Post

template_name = "blog/post_detail.html" # /_.html

def get_context_data(self, *args, **kwargs):

[...]

return context

def get(self, request, *args, **kwargs):

if self.request.is_ajax():

context = self.get_context_data(self, *args, **kwargs)

html = render_to_string('blog/comments.html', context, request=self.request)

return JsonResponse({'form': html})

[...]

def post(self, request, *args, **kwargs):

[...]

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值