Javascript 确认表格&；如果表单对JQuery有效，则显示消息

我正在开发我的Django应用程序，我想使用JavaScript来改进我的网站

我有一个表单，我想显示两件事：

• 提交前确认表格
• 如果表单提交良好，则显示一条消息：“表单已保存”

这是我第一次使用JS，我需要帮助来完成这个过程

这是我的代码：

    <form class = "form" method='POST' action=''> {% csrf_token %}
        <br></br>
        {{ form.as_p}}
        <br></br>

        <button type="submit">Valider</button>
    </form>

    <script>
        $('#form').submit(function() {
        var c = confirm("Click OK to continue?");
        return c; //you can just return c because it will be true or false
    });
    </script>

{%csrf\u令牌%}



{{form.as_p}}



瓦利德
$（'#form'）。提交（函数（）{
var c=确认（“单击确定继续？”）；
return c；//您可以只返回c，因为它将是true或false
});

如果我的表格有效并已保存：

<script type="text/javascript" >
                $(document).on('Valider', 'form.form', function(form) {
                var $form = $(form);
                $.ajax({
                    url:"/path_to_my_html_file/BC_form2.html",
                    type: "POST",
                    success: function(form) {
                    alert("Form is saved");
                    }
                });
                });
            </script>

$（document）.on（'Valider'，'form.form'，function（form）{
var$form=$（form）；
$.ajax({
url:“/path\u to\u my\u html\u file/BC\u form2.html”，
类型：“POST”，
成功：功能（形式）{
警报（“表单已保存”）；
}
});
});

你能帮我吗

---

谢谢

您可以根据自己的目的尝试采用此代码：

$（“#表单”）.submit（函数（e）{
//防止在默认post请求下提交表单并重新加载页面
e、 预防默认值（）；
如果（确认（“单击确定继续？”）{
//在这里，您可以调用AJAX请求
callAjax（$（'input[type=text]'）.val（）
}
});
函数callAjax（值）{
//向端点发出AJAX请求
//例如，获取ipify
$.ajax({
url:“https://api.ipify.org?format=json",
键入：“获取”，
成功：功能（形式）{
警报（“表单已保存”）；
}
});
}

瓦利德

在提交函数中使用.valid（）

$('#form').submit(function() {
  var isValid=$("#form").valid();
           if (isValid) { //If there is no validation error

            var c = confirm("Click OK to continue?");
            if(c){
              $.ajax({
                url:"/path_to_my_html_file/BC_form2.html",
                type: "POST",
                success: function(form) {
                  alert("Form is saved");
                }
              });

            }

          } 
          else {
            alert('form is not valid');                               
          }

        });
</script>

$（'#表单'）。提交（函数（）{
var isValid=$（“#形式”）.valid（）；
if（isValid）{//如果没有验证错误
var c=确认（“单击确定继续？”）；
如果（c）{
$.ajax({
url:“/path\u to\u my\u html\u file/BC\u form2.html”，
类型：“POST”，
成功：功能（形式）{
警报（“表单已保存”）；
}
});
}
} 
否则{
警报（“表单无效”）；
}
});

谢谢你的回答，但我有几个问题。第一，不考虑我的表格是否有效（所有字段都填写得很好）。然后，如果我的表单有效，我有两个窗口，但是如果您使用

必需的

属性并且没有填写所有输入，则表单

提交

按钮不起作用^^@Valentin-表单提交未触发。另外，如果您想添加额外的验证，您可以在onSubmit处理程序内部和确认之前进行验证。因此，如果您的表单无效，您只需向用户显示一个错误，并使用return停止函数执行，例如。好的，我必须理解您的答案，并看看如何做到这一点；）谢谢我得看看为什么我没有显示任何警报^^