django - How to create a form inside a detail view - django

Question

I am creating an online debate app using Django. I have used a class-based list view to create different topics using pk and once I click on the topic it takes me to its details page and once I go to the detail page I need two text-boxes to enter my for point and against point and after entering the point I need to display the point below the text-box. I have created a list of topics but I'm unable to do the text-box to that particular page.
This is my models.py
class DebateModel(models.Model):
title = RichTextUploadingField(blank=True,null= True)
body = models.TextField(max_length = 5000 , null=True,blank=True)
date_published = models.DateTimeField(auto_now_add=True)
date_update = models.DateTimeField(auto_now_add=True)
def __str__(self):
return self.title
class ForModel(models.Model):
DebateModel = models.ForeignKey(DebateModel,related_name="for_point",on_delete=models.CASCADE)
body = models.TextField(max_length = 5000)
date_added = models.DateTimeField(auto_now_add=True)
def __str__(self):
return '%s %s' % (self.DebateModel.title, self.body)
class AgainstModel(models.Model):
DebateModel = models.ForeignKey(DebateModel,related_name="against_point",on_delete=models.CASCADE)
body = models.TextField(max_length = 5000)
date_added = models.DateTimeField(auto_now_add=True)
def __str__(self):
return '%s %s' % (self.DebateModel.title, self.body)
this is my forms.py
class EditFor(forms.ModelForm):
class Meta:
model = ForModel
fields = ('body',)
widgets = {
'body': forms.Textarea(attrs={'class':'form-control'}),
}
this is my views.py
class HomeView(ListView):
model = DebateModel
template_name = "debate/home.html"
class ArticleDetailView(DetailView):
model = DebateModel
template_name = "debate/content.html"
context_object_name = 'debate'
class AddForView(CreateView):
model = ForModel
template_name="debate/content.html"
form_class = EditFor
def form_valid(self,form):
form.instance.DebateModel_id = self.kwargs['pk']
return super().form_valid(form)
success_url = reverse_lazy('debate/home.html')
this is my urls.py
path('',HomeView.as_view(),name = "home"),
path('article/<int:pk>',ArticleDetailView.as_view(),name = "debate-detail"),
path('article/<int:pk>/forpoint',AddForView.as_view(),name="add_For"),
This is my content.html
<button onclick="myFunction()">for</button>
<button onclick="myFunction()">against</button>
<form method="post" action="Add_For/">
{%csrf_token%}
</form>
<script>
function myFunction() {
var x = document.createElement("TEXTAREA");
var t = document.createTextNode("enter your for point");
var y = document.createElement("INPUT");
y.setAttribute("type", "submit");
document.body.appendChild(y);
x.appendChild(t);
document.body.appendChild(x);
}
</script>