如何从单个 HTML 按钮同时执行 JavaScript 和 Django？

Question

我的最终目标是在单击按钮时处理我的 Django 视图（以保存数据库信息），以及执行一些 JavaScript（以显示引导成功警报）。但是，我遇到的错误或潜在限制是我只能做一个或另一个。我通过简单地从按钮元素中删除onclick="somefunction()" 参数来确认这一点。如果它被删除，响应将成功“发布”到我的 Django 视图。如果保留，则仅执行 JavaScript 函数。

这是我的代码：

HTML：

{% csrf_token %}
<form method="POST" class="form_group">
  <!-- ...some unrelated bootstrap stuff -->
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal" id="cancel-button-id">Cancel</button>
    <button type="submit" class="btn btn-primary" onclick="indicate_if_successful()" id="save-customer-button-id" name="save_customer" value="save_customer">Save customer info</button>
    <!-- The button above is the one having issues -->
  </div>
</form>

Django 视图

def add(response):  # This function doesn't get executed if 'onclick' exists

    if response.method == "POST":  
        if response.POST.get("save_customer"):
            pass  # The code I want to execute

那么，为了同时执行 JavaScript 函数和 Django 视图，我有哪些选择？我应该首先以不同的方式做这一切吗？我愿意接受任何选择。

Answer 1

onclick="somefunction()" 在你的 btn 上加了一些锁。您可以使用document.getElementById('save-customer-button-id').addEventListener('click', function(e){...})，然后在函数体中编写代码来提醒和默认行为（发送表单）。

但是，我认为，它会如此之快，以至于用户可能看不到它。

Answer 2

您的 javascript indicate_if_successful() 函数在执行后应返回 true，因此它将首先运行，完成后表单将被提交，最好在此处使用 onsubmit 事件作为表单标签

<form method="POST" class="form_group" onsubmit="indicate_if_successful()">

</form>