使用bootbox.confirm()确认表单提交

the*_*Dmi 23 jquery twitter-bootstrap

我有一个表单,并希望拦截表单提交以使用bootbox显示确认对话框.

  1. 用户输入一些数据
  2. 用户点击提交
  3. 将显示确认对话框

如果用户点击OK,则表单应该提交,如果不是,则应该保留在页面上.

我试过这个:

$('#myForm').submit(function() {
    return bootbox.confirm("Are you sure?");
});
Run Code Online (Sandbox Code Playgroud)

但是,bootbox.confirm()立即返回,再次隐藏确认对话框.

然后我注意到有一个回调参数bootbox.confirm().但是,如果我$('#myForm').submit()要从回调中调用,这显然会再次显示确认对话框.

那么确认表单提交的正确方法是什么?

小智 41

我只是通过阻止默认表单行为来实现这一点,下面是解决方案.我在表单列表中使用它,每个表单都有一个提交删除按钮,它工作正常.

<script type="text/javascript">
    $('form').submit(function(e) {
        var currentForm = this;
        e.preventDefault();
        bootbox.confirm("Are you sure?", function(result) {
            if (result) {
                currentForm.submit();
            }
        });
    });
</script>
Run Code Online (Sandbox Code Playgroud)

  • 为我工作,没有使用currentForm它会陷入无限循环,谢谢你的帮助! (3认同)

the*_*Dmi 11

一如既往:在你问一个问题后,你自己找到了答案:-).请参阅此答案:https://stackoverflow.com/a/2420806/219187(另请注意答案中的注释).

适应我的问题,解决方案如下:

$('#myForm').submit(function() {
    var currentForm = this;
    bootbox.confirm("Are you sure?", function(result) {
        if (result) {
            currentForm.submit();
        }
    });
});
Run Code Online (Sandbox Code Playgroud)

  • $('#myForm').submit(function(e){e.preventDefault(); ...必须添加preventDefault (3认同)