jQuery对话框部分表单提交验证

Question

我有以下部分视图（为了使本论坛更加简单，我删除了一些格式）。 我的表单标签在父页面上，对话框上的项目是该表单的一部分。 这是一个强类型的局部视图。 我已经在模型中将密码和ConfirmPassword字段定义为[Required]。

@Html.LabelFor(m => m.password)
<a href="#" onclick="openResetPasswordDialog();">Reset Password</a>

<div id="dialogResetPassword" title="Reset Password">
    <p>Reset password for user: @Model.userId</p>
        @Html.LabelFor(m => m.password)
        @Html.PasswordFor(m => m.password)
        @Html.ValidationMessageFor(m => m.password)
    <div class="rowEnd"></div>

    @Html.LabelFor(m => m.confirmPassword)
    @Html.PasswordFor(m => m.confirmPassword)
    @Html.ValidationMessageFor(m => m.confirmPassword)
    <div class="rowEnd"></div>
</div>

我使用以下JavaScript进行对话框的初始化：

function initializeResetPasswordDialog() {
    $(resetPasswordDialogId).dialog(
    {
        autoOpen: false,
        autoResize: true,
        buttons: {
            Ok: function () {
                if (!($('#userForm').valid())) {
                    return false;
                }
                //more code goes here ...
                closeResetPasswordDialog();
            },
            Cancel: function () {
                closeResetPasswordDialog();
            }
        }
    });
}

我的对话框初始化，打开和关闭都很好，但是当我尝试检查对话框中各项的有效性时，我总是会得到“ valid”。

我不想提交整个表单，而只是在“确定”按钮上提交密码和“确认密码”字段，然后启动我的验证。 有关如何执行此操作的任何建议？

Answer 1

好的，因此我通过将以下函数添加到jQuery对话框的open参数中来解决了该问题：

        open: function () {
            $(this).parent().appendTo("#userForm");
        }

我注意到，当初始化jQuery对话框时，即使它在我的表单中，当在浏览器中呈现HTML页面时，对话框div也移到了表单之外。 为了使验证生效，输入必须在表单内。

我希望这篇文章也能对其他人有所帮助！