Заставить функцию Django работать с HTML при нажатии на кнопку

Я пытаюсь вызвать представление так, чтобы оно отображалось в div на уже существующей странице, а не ссылалось на новую страницу для размещения комментария. Пока мне удалось вызвать div, который отображается после нажатия кнопки и скрывается при повторном нажатии. В идеале, когда он отображается, должна появляться форма для комментария, но на данный момент это только кнопка отправки. Мне интересно, как я могу заставить эту форму отображаться в этом div, как это происходит на другой HTML-странице. Если есть еще какая-либо необходимая информация, дайте мне знать, просто не хотел давать слишком много информации для просмотра.

Views.py:

class AddCommentView(CreateView):
model = Comment
form_class = CommentForm
template_name = 'storysharing/comment.html'

def form_valid(self, form):
    form.instance.story_id = self.kwargs['pk']
    return super().form_valid(form)

def get_success_url(self):
    return reverse('storysharing:story_details', kwargs={'story_id':self.kwargs['pk']})

urls.py:

app_name = 'storysharing'
urlpatterns = [
path('', views.index, name = 'index'),
path('<int:story_id>/', views.story_details, name = 'story_details'),
path('add_story/', views.add_story, name = 'add_story'),
path('thanks/', views.story_added, name = 'story_added'),
path('final_post/<int:pk>', UpdateStoryView.as_view(), name = 'final_post'),
path('review/', views.review, name = 'review'),
path('get_location/', views.get_location, name = 'get_location'),
path('<int:pk>/comment', AddCommentView.as_view(), name = 'comment'),
]

page.html, тег, где ссылка обычно ссылается на другую страницу и успешно добавляет комментарий после ввода необходимой информации. Ниже находится кнопка 'show div' и div, который я пытаюсь сделать содержащим ту же форму, что показана в теге:

<a href="{% url 'storysharing:comment' story.id %}">Add Comment<a/>

                    <button type="button" name="answer" onclick="showDiv('toggle')">Add 
Comment</button>

<div id="toggle" style="display:none" class="comments">
<form action={% url 'storysharing:comment' story.id %} method ="POST">
{%csrf_token%}
{{form.as_p}}
<button>Submit</button>
</div>

Рисунок html страницы, которая работает:

Фотография того, что отображается на странице:

В качестве побочного вопроса, есть ли способ убрать линию вокруг div? Любая дополнительная информация предоставляется по запросу, заранее спасибо!

<!-- we will use js to send a post request when this button is clicked -->
<button id="my-button">Submit</button>

// using jquery, we will set the function that executes when the button is clicked
$('#my-button').click(function() {

  // launch an ajax request:
  $.ajax({
    type : 'POST',
    url : '<the-url>',
    data : {
      someKey : 'someValue'
    },
    success : function(response) {
      
      // this function executes when we receive a succesful response from the backend

      // unpack the response:
      result = response.result;

      // update html page:
      ...
 
   }
  }
});

def my_view_function(request):

    """ this function executes when the ajax request is sent """

    # unpack the request
    some_value = request.POST.get('someKey')

    # do some logic:
    ...
  
    # pack the response:
    response = {
        "result" : "some result"
    }

    return JsonResponse(response)