flask-js form.validate_on_submit() confirm() 集成

Question

我有一个表格可以在一些价值观审查后写下更改。在routes.py 中，我确保通过.validate_on_submit() 验证表单：

    ### ... rest of routes.py ....
    form = VariantOverallRevision()
    if form.validate_on_submit() :
        ### ... code to write new class on file ...
        flash("sent!")
    ### ... rest of routes.py ....

我想在这个提交中通过js插入一个yes/no确认按钮，但是我不知道如何在点击后集成一个“提交停止”。

我设法在按钮元素中集成了confirm()，但显然只要单击按钮就会发送表单（而不是在调用 js confirm() 之后）：

function confirm_ACMG_review()
{
    confirm("Save data?");
}
if (confirm_ACMG_review) {
    //proceed to sumbmission
}
else {
    //block submission
}
document.getElementById('manual_ACMG_annotation_confirm_review').onclick = confirm_ACMG_review;

这里是HTML 部分：

        <form id="manual_ACMG_annotation_confirm_form" action="" method="post" novalidate>
            {{ form.hidden_tag() }}
            {{ form.submit( id = "manual_ACMG_annotation_confirm_review", style = "font-size: 120%; font-weight: bold;" ) }}
        </form>

我知道我可以打开不同的页面/重定向到其他 URL 等，但我想知道是否有任何方法可以将烧瓶提交与 js 集成。

非常感谢您的任何帮助！

Answer 1

您可以在点击事件上使用preventDefault() 方法，以便默认情况下不提交表单。

document.getElementById("manual_ACMG_annotation_confirm_review").addEventListener("click", function(event){
  event.preventDefault() // prevent default form submission
  // here you can implement confirmation
  // set confirm_ACMG_review value based on confirmation result
  if (confirm_ACMG_review) {
      document.getElementById('manual_ACMG_annotation_confirm_form').submit();  // submit form manually
  }
});