4

我有一个“更改密码”页面，需要在发送之前通过 Javascript 对页面上输入的任何密码进行哈希处理。更复杂的是，页面是通过 jQuery load() 调用加载的，并由 jQuery.Form ajaxForm() 调用提交。一切都在 MVC2 中工作，但 MVC3 给我带来了麻烦。

也就是说，我有一个带有“更改密码”链接的页面，单击该链接时，会将更改密码页面加载到 jQuery 模式弹出窗口中，然后通过 jQuery.Form 库提交更改密码页面上的表单（基本上只是包装了一个$.ajax 调用），并将其结果返回到模态相同的模态弹出窗口中。

本质上，我有一个具有两个属性的模型，OldPassword 和 NewPassword。我有两个由视图生成的隐藏字段。它们保存另外两个字段 PrehashOldPassword 和 PrehashNewPassword 的散列值，并通过 keyup 事件进行更新（我知道，这意味着它对每个 keyup 执行整个 SHA256 散列......效率低下，但完成了测试工作）。这里的关键是需要在这些 Prehash 字段上执行正则表达式验证和必填字段验证，这些字段仅存在于客户端（显然我不想以任何方式将这些字段传输到服务器）。

所以我手动创建了这两个并将 data-val-* 属性添加到元素中，即它们不是由 MVC 助手生成的，等等。我猜这是我遗漏的地方。当表单在所有字段为空的情况下提交时，所有应该弹出的错误都会弹出，但表单会继续前进并提交。

==

所以我尝试过的事情：

是的，已经调用了不显眼的库 parse() 方法来解析 AJAX 加载的表单内容，并且它似乎正确获取了所有数据验证内容，因为我看到错误显示为字段 blur()，并且当我点击提交（在 ajax 请求完成并替换弹出窗口的内容之前）。

可能的注意事项：在 AJAX 成功将更改密码页面加载到弹出窗口之后，对不显眼库的 parse 方法的调用发生... AJAX 表单提交绑定放在 document.ready 加载的内容，因此，AJAX 表单提交绑定可能在解析方法可能绑定到提交事件的验证调用之前绑定，因此在之前触发......

但是，（1）我在其他地方做同样的事情没有问题，唯一的区别是我手动将这些 data-val-* 属性放在我手动创建的元素上！并且（2），如果我在 OldPassword 或 NewPassword 字段上导致某种错误，即未将值加载到其中而导致必填字段验证错误，它们会显示错误，并成功阻止表单通过 jQuery.Form 提交方法。

所以我认为这里一定有问题：

<input id="PrehashNewPassword" type="password" name="PrehashNewPassword" data-val-required="The password field is required." data-val-regex-pattern="<%= RegexHelper.PasswordRegularExpression %>" data-val-regex="<%= RegexHelper.PasswordRegularExpressionError %>" data-val="true" />

我知道 jquery.validate 正在制定正确的规则，因为我确实看到了错误。当这些手动生成的元素中出现错误时，它只是不会阻止表单提交，除非我这样做，并在表单的 AJAX 提交中添加一个预提交回调：

        $("#ChangePasswordForm").ajaxForm({
            beforeSubmit: function () { if (!$('#ChangePasswordForm').valid()) { return false; } },
            target: '#overlay'
        });

虽然这可行，但它有点难看，我相信它会导致验证被调用两次......不是什么大不了的事，但不太理想。那么我需要在不显眼的库中进行其他调用来绑定这些吗？

4

2 回答 2

6

不确定您是否发现问题，但如果表单无效，您可以尝试在其中返回 false ......

.
.
.
    if (!$('form').valid()) {
           return false;
    }

    // JSON POST...
.
.
.

如果这不起作用，那么您可以尝试使用：

$.validator.unobtrusive.parse($("#dynamicData"));

在动态添加您的自定义输入之后。“dynamicData”是包裹在表单周围的元素的 ID

以上从这里找到：http ://weblogs.asp.net/imranbaloch/archive/2011/03/05/unobtrusive-client-side-validation-with-dynamic-contents-in-asp-net-mvc.aspx

于 2011-03-08T20:25:18.710 回答
0

出于兴趣，如果您只是让表单进行验证会发生什么？

<script type="text/javascript">
    $("form").submit(function (evt) {

        // validate here should trigger invalid fields
        $('form').valid();

        // JSON POST...         

        // stop form submitting
        evt.preventDefault();
    });
</script>
于 2011-01-26T09:06:28.990 回答