How to add comments functionality to a django web app?

Question

I want to add the functionality of adding comments in the same html page with post details starting from this class based view. I also have left below the model and the html template that I want to use. Please help me

The class based view that I want to use as a starting point :

class PostDetailView(DetailView):
    model = Post

The model:

class Comments(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE)
    post = models.ForeignKey(Post, on_delete=models.CASCADE)
    content = models.TextField()
    date_added = models.DateTimeField(default=timezone.now)

    def __str__(self):
        return self.content

The html template:

    <div id="comments">
                
                <h3>{{ comments.total }}</h3>

                <ol class="commentlist">
                    {% for comment in comments %}
                    <li class="depth-1">

                        <div class="avatar">
                            <img width="50" height="50" alt=""
                                src="{{ comment.user.profile.image.url }}"
                                class="avatar">
                        </div>

                        <div class="comment-content">

                            <div class="comment-info">
                                <cite>{{ comment.user }}</cite>

                                <div class="comment-meta">
                                    <time datetime="2014-07-12T23:05"
                                        class="comment-time">{{ comment.date_added|date:"F d, Y" }}</time>

                                </div>
                            </div>

                            <div class="comment-text">
                                <p>{{ comment.content }}</p>
                            </div>

                        </div>

                    </li>
                    {% endfor %}
                </ol> <!-- /commentlist -->


                <!-- respond -->
                <div class="respond">

                    <h3>Leave a Comment</h3>

                    <!-- form -->
                    <form action="" method="POST">
                        {% csrf_token %}
                        <fieldset>

                            <div class="group">
                                {{ form|crispy }}
                                <button class="submit full-width" type="submit">Add Comment</button>
                            </div>

                        </fieldset>
                    </form> <!-- /contactForm -->

                </div> <!-- /respond -->

            </div> <!-- /comments -->

Answer 1

Override DetailView's get_context_data method to transfer comments through context. add this method in your class PostDetailView.

def get_context_data(self, **kwargs):
            context = {}
            if self.object:
                context['object'] = self.object
                context['comments']=Comments.objects.all()   #modify this queryset according to how you want to display comments
    
            context.update(kwargs)
            return super().get_context_data(**context)

than in template you can include this piece of code

{% for comment in comments%}
      <div>
        {{comment}}
      </div>
{% endfor %}

and to get comments, In forms.py

from django import forms
from .models import Comments

    class CommentForm(forms.Form):
        class Meta:
            model = Comments
            fields = []                 #mention fields of comments u want to render in form

you have to extend FormView along with DetailView as DetailView dosent have post method to override.

So in views.py:

from .forms imoprt CommentForm
from django.views.generic.edit import FormView

class PostDetailView(DetailView, FormView):
    model = Post
    form_class = CommentForm

    def post(self, request, *args, **kwargs):
        form = self.get_form()
        if form.is_valid():
            #do what you want with data

I suggest you go through the Methods of the classes to override them. FormView