Django HTML POST删除按钮和信息

时间:2017-08-19 02:09:29

标签: html django forms post button

我有一个包含电子邮件地址的表格,我需要从表格中删除电子邮件地址。该表是在电子邮件地址旁边有删除按钮。

在初始页面加载时,我的视图将电子邮件地址发送到Django模板。当用户点击您要删除的电子邮件地址旁边的删除按钮时,我需要按下相应电子邮件地址信息的POST按钮,以便我的视图可以从数据库中删除正确的电子邮件地址。

我已经查看了提交按钮和POST信息,但POST通常通过发送输入数据来工作。在这种情况下,没有输入数据。以下是模板中的代码:

        <tr>
            <td>{% trans "Email" %}</td>
            <td>{% trans " " %}</td>
        </tr>
        </thead>
        <tbody>
        {% for licensed_user in licensed_users %}
            <tr>
                <td>{{ forloop.counter }}</td>
                <td>{{ licensed_user.user.email }}</td>
                <td>
                    <form class="flex-container" method="post" action="{% url 'reseller_dashboard' %}" >
                        {% csrf_token %}
                        <div class="input-group">
                            <button name="delete" type="submit" class="btn btn-default">DELETE
                            </button>
                        </div>
                    </form>
                </td>
            </tr>

我需要在提交按钮时发送licensed_user.user.email以及POST方法。

2 个答案:

答案 0 :(得分:3)

另一种方法,你也可以使用ajax方法;

{% for licensed_user in licensed_users %}
  <tr class="tr__{{ forloop.counter }}">
    <td>{{ forloop.counter }}</td>
    <td>{{ licensed_user.user.email }}</td>
    <td><button data-email="{{ licensed_user.user.email }}"
                data-loop="{{ forloop.counter }}"
                class="btn btn-default delete-action">Delete</button>
    </td>
  </tr>
{% endfor %}

<script>
  $('.delete-action').click(function(){
    var email = $(this).data('email');
    var loop = $(this).data('loop');

    $.ajax({
      type: "POST",
      url: "{% url 'reseller_dashboard' %}",
      data: {
        'csrfmiddlewaretoken': '{{ csrf_token }}',
        'email': email,
        'delete': true
      },
      success: function(message) {
        console.log(message);
        $('.tr__' + loop).remove(); // remove this single `<tr>`
      },
      error: function(error) {
        console.log(error);
      }
    });
  });
</script>

答案 1 :(得分:2)

您可以设置隐藏的输入字段,然后在视图中处理删除。隐藏的输入看起来像:

<form class="flex-container" method="post" action="{% url 'reseller_dashboard' %}" > 
{% csrf_token %}
  <div class="input-group"> 
    <input type="hidden" name="email" value="{{licensed_user.user.email}}">
    <button name="delete" type="submit" class="btn btn-default">DELETE </button>
  </div> 
</form>