Question

我有一个表格，我想要验证，并假设一切正确，我希望它然后弹出一个对话框确认他们的详细信息，这是我到目前为止的代码示例：

var userConfirmed = false;

$("#dialog").dialog({
    buttons: {
        "Yes": function() {
            userConfirmed = true;
            $("#inputform").submit();
        },
        "No, I'll change them.": function() {
            $(this).dialog("close");
        }
    }
});

// check they've submitted what they need to
$("form").submit(function() {

    // lots of these
    if (something) {
        return false;
    }

    $("#dialog").dialog("open");

    return userConfirmed;

});

初始验证工作正常 - 它检查标准并标记为适当的，如果没有满足任何条件，它将按我的意愿显示模态框。到目前为止，非常好。

然而问题是，当我按“是”提交表单时，它不提交，直到你再次按下实际的“提交”按钮，唉！任何使用jQuery提交论坛的调用都会失败。

非常欢迎任何建议，谢谢。

Answer 1

对话框打开的事实并不会停止执行代码。 <{1}}在valToReturn被设置之前返回。

你可以这样做：

$("form").submit()

Answer 2

一如既往，我建议使用jQuery validate进行验证，然后代码就像这样

$("#formid").validate({
    submitHandler: function(form) {
               $("#dialog").dialog({
     buttons: {
         "Ok": function() {
             form.submit();
             $(this).dialog("close");
         },
         "Cancel": function() {
             $(this).dialog("close");
         }
     }
});
    }
});

LIVE DEMO

Answer 3

在某处添加一个标记，告诉对话框是否已经出现，并且用户单击是。例如：

var userConfirmed = false;
$("form").submit(function(e) {
    if ( userConfirmed ) {
        userConfirmed = false; // Reset it to false
        return true; // No need to validate anything, that was already done last time
    }
    var form = $(this);
    // ...
        "Yes": function() {
            userConfirmed = true; // Confirm that the dialog was shown and the user clicked "Yes"
            $(this).dialog("close");
            form.submit(); // Try again; this time, the validation was already done
        },
    // ...
    return false; // Don't submit; the user haven't confirmed the info on the dialog
});

如果没有那个标志，你将处于鸡与蛋的状态：提交会打开对话框，而调用$("form").submit()的对话框会再次打开对话框...

如果您有多种表单而又不想使用“全局”变量，则可以将data用于相同目的。

更新： jsFiddle的实时示例。在Chrome和Firefox中成功测试（提交后3秒将显示空白页）。

Answer 4

我会将事件附加到按钮而不是表单。只需将其附加到提交按钮单击即可。然后，您可以使用event.preventDefault()来保持表单的提交，直到确认对话为止。在“是”功能中，只需输入$('form').submit()即可。无需担心返回值。

提交验证的jQuery，最后是模态对话框？

4 个答案: