Как сохранить модальную форму bootstrap после отправки в django?

Я новичок в ajax и мне нужна помощь. Я смог открыть модальную форму, когда я нажал на Добавить оценку, теперь моя проблема в том, как сохранить форму в базу данных, используя модальную форму? Эта страница ошибки будет показана, если я нажму сохранить изменения в модальной форме.

views.py

 class GradeUpdateView(LoginRequiredMixin, UpdateView):
    model = Subject
    template_name = 'teacher/modal.html'
    # fields = ['grade']
    # success_url = '/'
    form_class = UpdateGradeForm

    def get_success_url(self):
        subject = self.object.subject_name
        year = self.object.year_taken
        return reverse_lazy('student-list', kwargs={"subject_name_id": subject.id, "year_taken": year})

modal.html

<!-- Modal -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalCenterTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <form method="post" id="grade-form"> 
        <div class="modal-body">
            
                {% csrf_token %} 
                {{ form.as_p }} 
                {% comment %} <input type="submit" class="btn btn-sm btn-block btn-primary" value="Save">  {% endcomment %}
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" data-form-url="" class="btn btn-primary" id="save-form">Save changes</button>
                </div>
            
        </div>
      </form> 
    </div>
  </div>
</div>

main.js

var modalDiv = $("#modal-div");

$(".open-modal").on("click", function () {
    $.ajax({
        type: 'GET',
        url: $(this).attr("data-url"),
        success: function (data) {
            modalDiv.html(data);
            $("#exampleModalCenter").modal();
        }
    });
});

<form method="post" id="grade-form" action = " The url path where you will handle the submit of form"> 
        <div class="modal-body">
            
                {% csrf_token %} 
                {{ form.as_p }} 
                {% comment %} <input type="submit" class="btn btn-sm btn-block btn-primary" value="Save">  {% endcomment %}
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" data-form-url="" class="btn btn-primary" id="save-form">Save changes</button>
                </div>
            
        </div>
      </form>