Ниже приведен код для написания комментариев и ответов на них. Я использовал django 2.2 и jQuery (Ajax part) здесь.
У меня проблема с ответом на формы комментариев. Когда я нажимаю «Добавить ответ» (без данных в форме), вместо проверки появляется источник страницы. Если я добавляю текст и нажимаю «Добавить ответ» (форма с данными), появляется ошибка: The view spot.views.SpotDetailView didn't return an HttpResponse object. It returned None instead.
Добавление комментариев - работает правильно, добавляет без ошибок (когда данные в форме ). Проверка работает (пустая форма), но сообщения об ошибках также появляются в других формах (формы ответа на комментарий).
Я прошу помощи, спасибо.
detail_page . html
<div class="comment-section">
{% include 'spot/comments.html' %}
</div>
комментарии. html
<div class="mt-4 mb-4">
{% for comment in object.all_comments %}
<div class="card mt-2">
<div class="card-body">
<div class="row">
<div class="col-md-2 col-sm-2">
<img src="https://image.ibb.co/jw55Ex/def_face.jpg" class="img img-rounded img-fluid"/>
<p class="text-secondary text-center">{{ comment.date_create }}</p>
</div>
<div class="col-md-10">
<div class="float-right">
<i class="fas fa-ellipsis-h" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></i>
<div class="dropdown-menu">
<a class="dropdown-item" href="{% url 'spot_comment_update_url' comment.pk %}"><i class="fas fa-edit"></i> Edit</a>
<a class="dropdown-item" href="{% url 'spot_comment_delete_url' comment.pk %}"><i class="fas fa-trash-alt"></i> Delete</a>
</div>
</div>
<p><a class="float-left" href="#"><strong>{{ comment.author }}</strong></a></p>
<div class="clearfix"></div>
<p>{{ comment.text }}</p>
</div>
</div>
{% for reply in comment.replies.all %}
<div class="card card-inner mb-2">
<div class="card-body">
<div class="row">
<div class="col-md-2 col-sm-2">
<img src="https://image.ibb.co/jw55Ex/def_face.jpg" class="img img-rounded img-fluid"/>
<p class="text-secondary text-center">15 Minutes Ago</p>
</div>
<div class="col-md-10">
<div class="float-right">
<i class="fas fa-ellipsis-h" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></i>
<div class="dropdown-menu">
<a class="dropdown-item" href="{% url 'spot_comment_update_url' reply.pk %}"><i class="fas fa-edit"></i> Edit</a>
<a class="dropdown-item" href="{% url 'spot_comment_delete_url' reply.pk %}"><i class="fas fa-trash-alt"></i> Delete</a>
</div>
</div>
<p><a href="#"><strong>{{ reply.author }}</strong></a></p>
<p>{{ reply.text }}</p>
</div>
</div>
</div>
</div>
{% endfor %}
<div class="mt-4 mb-4">
<a class="reply-btn float-right btn btn-outline-primary btn-sm ml-2 mb-2" id="reply-button-{{ comment.id }}" value="{{ comment.id }}"> <i class="fa fa-reply"></i> Reply</a>
<div class="replied-comment mt-4 mb-4" id="reply-container-{{ comment.id }}" style="display:none">
{% if user.is_authenticated %}
<form class="justify-content-center reply-form" action="." method="post" novalidate>
{% csrf_token %}
<input type="hidden" name="comment_id" value="{{ comment.id }}">
{% include 'includes/bs4_form.html' with form=form %}
<button class="btn btn-outline-secondary mt-2 mb-2" id="reply-comment-{{ comment.id }}" value="{{ comment.id }}" type="submit">Add answer</button>
</form>
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="mt-4 mb-4">
<h3>Comments:</h3>
{% if user.is_authenticated %}
<form class="justify-content-center comment-form" action="." method="post" novalidate>
{% csrf_token %}
{% include 'includes/bs4_form.html' with form=form %}
<input class="btn btn-outline-secondary mt-2" type="submit" value="Add comment">
</form>
{% endif %}
</div>
jQuery код
<script type="text/javascript">
$(document).on('submit', '.comment-form', function(event){
event.preventDefault();
var serialized = $('.comment-form').serialize();
$.ajax({
type: 'POST',
url: $(this).attr('action'),
data: serialized,
dataType: 'json',
success: function(response){
$('.comment-section').html(response['form']);
$('textarea').val('');
$('.reply-btn').click(function(){
$('.replied-comment').fadeToggle();
$('textarea').val('');
});
},
error: function(rs, e){
console.log(rs.responseText);
}
});
});
$(document).on('submit', 'form[id^="reply-comment-"]', function(event){
event.preventDefault();
var serialized = $('.reply-form').serialize();
var pk = $(this).attr('value');
$.ajax({
type: 'POST',
url: $(this).attr('action'),
data: serialized,
dataType: 'json',
success: function(response){
$('#reply-comment-' + pk).html(response['form']);
$('textarea').val('');
$('.reply-btn').click(function(){
$('.replied-comment').fadeToggle();
$('textarea').val('');
});
},
error: function(rs, e){
console.log(rs);
}
});
});
</script>
views.py
class SpotComment(SingleObjectMixin, FormView):
template_name = 'spot/spot_detail.html'
form_class = CommentModelForm
model = Spot
def get_success_url(self):
return reverse('spot_detail_url', kwargs={'slug': self.object.slug, 'id': self.object.pk})
def post(self, request, *args, **kwargs):
self.object = self.get_object()
form = self.form_class(request.POST)
form.instance.spot = self.object
form.instance.author = self.request.user
if form.is_valid():
reply = request.POST.get('comment_id')
comment_qs = None
if reply:
comment_qs = Comment.objects.get(id=reply)
form.instance.reply = comment_qs
form.save()
if request.is_ajax():
context = {
'form': form,
'errors': form.errors,
'object': self.object,
}
html = render_to_string('spot/comments.html', context, request=request)
return JsonResponse({'form': html})
else:
context = {
'form': form,
'errors': form.errors,
'object': self.object,
}
html = render_to_string('spot/comments.html', context, request=request)
return JsonResponse({'form': html})