Обновление объектов в Django с помощью htmx и SingleObjectMixin

Я впервые использую htmx. У меня есть таблица, в которой каждая ячейка является объектом grade. До использования htmx я сделал каждую ячейку ссылкой на UpdateView для объекта. Теперь я пытаюсь заставить пользователя изменять поле score объекта прямо в таблице с помощью htmx. Я уверен, что делаю несколько вещей неправильно.

Моя страница загружается как положено, и таблица отображается как положено. когда я ввожу ячейку, я получаю ошибку Forbidden 403. CSRF Verification Failed.

Цель этого сообщения/вопроса - выяснить, как преодолеть эту 403 ошибку. Если окажется, что я иду совершенно неверным путем, используя SingleObjectMixin, пожалуйста, дайте мне знать.

Вид

class GradeChange(SingleObjectMixin, View):
    """ view to handle htmx grade change"""
    model = Grade

    def post(self, request, *args, **kwargs):
        grade = self.get_object()
        assessment = Assessment.objects.get(grade=grade.pk)
        print(assessment)
        classroom = Classroom.objects.get(classroom=grade.cblock)
        print(classroom)
        if grade.score == "EXT" or grade.score=="APP" or grade.score=="DEV" or grade.score=="BEG":
            grade.save()
            return HttpResponse("S")
        else:
            return HttpResponse("")

шаблон

<table class="table table-bordered table-sm">
      <thead>
        <tr>
          <th class="col-3" scope="col">Students</th>
          {% for obj in objective_list %}
          <th class="col-2" scope="col">{{ obj.objective_name }}</th>
          {% endfor %}
          <th scope="col">Comments</th>
        </tr>
      </thead>
      <tbody>
        <form action="" method="post" class="form-group">
        {% csrf_token %}
        {% for student in student_list %}
        <tr>
          <td >{{ student.student_first }}&nbsp;{{ student.student_last }}</td>
          {% for g in grade_list %}
            {% if g.student.id == student.id %}
            <td><a  href="{% url 'gradebook:updatesinglegrade' g.assessment.pk g.cblock.pk g.pk %}"></a>
              <input type="text" hx-post="{% url 'gradebook:grade-change' g.pk %}" hx-target="" hx-trigger="keyup delay:2s" class="form-control score" title={{ g.score }} name="score" id="input-{{ forloop.counter0 }}" placeholder={{ g.score }} required>
              
            </td>
            {% endif %}
          {% endfor %}
          <td>
            {% for comms in comment_list %}
              {% if comms.student == student %}
                <a class="grade-comment" href="{% url 'gradebook:addcomment' comms.pk assess_pk class_pk %}">{{ comms.comment|truncatewords:10 }}</a>
              {% endif %}
            {% endfor %}
          </td>
        </tr>
        {% endfor %}
      </form>
      </tbody>
    </table>

Токен CSRF должен быть включен в запрос HTMX POST. В настоящее время вы включаете его только в обычную форму, но запрос HTMX инициируется из дочернего элемента ввода, где маркер не присутствует. Поэтому просто включите следующий атрибут hx-header в родительский элемент, например <form> или событие <body> является хорошим кандидатом:

<body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
Вернуться на верх