javascript - 使用 jquery Ajax 删除 django 中的模型对象

Question

很难使用 jquery/ajax 删除对象。我已经实现了一个表，其中包含来自 Appointment 模型的对象列表的行。每行都有一个删除按钮。

对象表的模板是:

<table class="table table-striped table-bordered table-list">
    <thead>
     <tr>
        <th><em class="fa fa-cog"></em></th>
        <th class="hidden-xs">ID</th>
        <th>Patient Name</th>
        <th>Day</th>
        <th>Time</th>
        <th>Location</th>
     </tr>
    </thead>
    <tbody>
        {% for appointment in appointments %}
            <tr>
                <td align="center">
                    <button class="delete_button" id="{{ appointment.id }}">
                        <em class="fa fa-trash"></em>
                    </button>
                </td>
                  <td>1</td>
                <td class="hidden" id="appointment_id">{{ appointment.id }}</td>
                <td>{{ appointment.patient }}</td>
                <td>{{ appointment.day }}</td>
                <td>{{ appointment.time }}</td>
                <td>{% if appointment.clinic %}
                      {{ appointment.clinic }}
                      {% endif %}
                      {% if appointment.hospital %}
                      {{ appointment.hospital }}
                      {% endif %}
                </td>
            </tr>
        {% endfor %}
    </tbody>
</table>

Javascript 如下:

$(document).ready(function(){
    $(".delete_button").click(function() {
        var id = $(this).attr('id');
        $.ajax({
            url: "{% url 'deleteappointment' %}",
            data: { 'id' : id },
            beforeSend: function(xhr) {
                xhr.setRequestHeader("X-CSRFToken", {% csrf_token %} );
            },
            success: function(response){
            }
        });
    });
});

当我点击删除按钮时没有任何反应。我在这里做错了什么？

编辑 2 这是在 ajax 请求中进行的:控制台中的语法错误:

beforeSend: function(xhr) {
      xhr.setRequestHeader("X-CSRFToken", <input type='hidden' name='csrfmiddlewaretoken' value='LUgmNbcWfkIR9KpLi7lzsn0QOk' /> );
                },

如何防止 csrftoken 标签在此处呈现整个输入字段？

Answer 1

您正在使用 {% csrf_token %} 模板标签，它以 html 格式为表单插入 token 。您可以使用其他类型的括号(引号内)

xhr.setRequestHeader("X-CSRFToken", {% csrf_token %} );

应该是

xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");