Post comments in Django Homepage - html

Question

i have this code with me as part of a tutorial i was following for blog post. I have a comment section on my detailview, I want it to be shown in the homepage as well. I tried with some codes, but the problem is same comments are showing in all posts (only) in homepage.
please take a look at the code.
I have a comment snippet which I use it in my homepage.
<!-- Comment showing section -->
<div class="main-comment-section">
<div class="container-fluid mt-2">
<div class="form-group row">
<!-- Comment Form -->
<form class="comment-form" method="post" action=".">{% csrf_token %}
<div class="form-group">
<textarea name="content" cols="60" rows="2" maxlength="1000" required="" id="id_content"></textarea>
</div>
<button type="submit" value="submit" class="btn-sm btn-outline-light" style="color: black;">Comment</button>
</form>
<!-- Comment Form end -->
</div>
</div>
{{ comments.count }} Comment{{ comments|pluralize }}
{% for comment in comments %}
<blockquote class="blockquote">
<img style="float:left; clear: left;" class="rounded-circle article-img" height="10" width="10" src="{{ comment.user.profile.profile_pic.url }}"><h6>{{ comment.user.first_name|capfirst }} {{ comment.user.last_name|capfirst }}</h6><br>
<p style="font-size: 8px;">{{ comment.timestamp }}</p>
<p style="font-size: 14px;" class="mb-3">{{ comment.content }}</p>
<a type="button" name="button" class="reply-btn ml-4"><p style="font-size: 13px;"> Reply</p></a>
{% if request.user == comment.user %}
Delete</td>
{% endif %}
</blockquote>
{{ comment.reply.count }}
<div class="replied-comments col-md-5" style="display: none;">
{% for reply in comment.replies.all %} <!--replies is the related name in the model-->
<blockquote class="blockquote">
<img style="float:left; clear: left;" class="rounded-circle article-img" height="50" width="50" src="{{ reply.user.profile.profile_pic.url }}"><h6>{{ reply.user.first_name|capfirst }} {{ reply.user.last_name|capfirst }}</h6><br>
<p style="font-size: 13px;" class="mb-3">{{ reply.content }}</p>
</blockquote>
{% endfor %}
<div class="form-group row">
<form class="reply-form" method="post" action=".">{% csrf_token %}
<input type="hidden" name="comment_id" value="{{ comment.id }}">
<div class="form-group">
<textarea name="content" cols="60" rows="2" maxlength="1000" required="" id="id_content"></textarea>
</div>
<input type="submit" value="submit" class="btn-sm btn-outline-light" style="color: black;">
</form>
</div>
</div>
{% endfor %}
</div>
PS. The comment is correctly showing in the detail view, but in homepage its showing all the comments of all posts in every posts.

Answer 1

Have the following changes,
views.py
...
comments = Comment.objects.filter(post=posts_list.first()) # Delete this line
context = {
'page':page,
'posts':posts,
'tag':tag,
'actions':actions,
'comments': comments, # Delete this too
}
return render(request, 'posts/users/myhome.html', context)
Change posts/comment_section.html too,
<!-- Comment showing section -->
<div class="main-comment-section">
<div class="container-fluid mt-2">
<div class="form-group row">
<!-- Comment Form -->
<form class="comment-form" method="post" action=".">{% csrf_token %}
<div class="form-group">
<textarea name="content" cols="60" rows="2" maxlength="1000" required="" id="id_content"></textarea>
</div>
<button type="submit" value="submit" class="btn-sm btn-outline-light" style="color: black;">Comment</button>
</form>
<!-- Comment Form end -->
</div>
</div>
{% if not post.comment_set.all %}
No comments to display.
{% endif %}
{% for comment in post.comment_set.all %}
<blockquote class="blockquote">
<img style="float:left; clear: left;" class="rounded-circle article-img" height="10" width="10" src="{{ comment.user.profile.profile_pic.url }}"><h6>{{ comment.user.first_name|capfirst }} {{ comment.user.last_name|capfirst }}</h6><br>
<p style="font-size: 8px;">{{ comment.timestamp }}</p>
<p style="font-size: 14px;" class="mb-3">{{ comment.content }}</p>
<a type="button" name="button" class="reply-btn ml-4"><p style="font-size: 13px;"> Reply</p></a>
{% if request.user == comment.user %}
Delete</td>
{% endif %}
</blockquote>
{{ comment.reply.count }}
<div class="replied-comments col-md-5" style="display: none;">
{% for reply in comment.replies.all %} <!--replies is the related name in the model-->
<blockquote class="blockquote">
<img style="float:left; clear: left;" class="rounded-circle article-img" height="50" width="50" src="{{ reply.user.profile.profile_pic.url }}"><h6>{{ reply.user.first_name|capfirst }} {{ reply.user.last_name|capfirst }}</h6><br>
<p style="font-size: 13px;" class="mb-3">{{ reply.content }}</p>
</blockquote>
{% endfor %}
<div class="form-group row">
<form class="reply-form" method="post" action=".">{% csrf_token %}
<input type="hidden" name="comment_id" value="{{ comment.id }}">
<div class="form-group">
<textarea name="content" cols="60" rows="2" maxlength="1000" required="" id="id_content"></textarea>
</div>
<input type="submit" value="submit" class="btn-sm btn-outline-light" style="color: black;">
</form>
</div>
</div>
{% endfor %}
</div>