输入验证与在多页表单上提交所需的

Question

我有一个多页表单，我正在尝试使用 jquery validate 进行验证。用户基本上有 4 个选项：next、prev、save、submit。

save、next、prev都将当前页面作为一个整体保存到表单中； submit 与 save 相同，但会触发一些与工作流相关的额外功能，然后转到网站的另一部分。

我需要始终验证用户输入。 jquery 验证工作得很好。但是...我需要根据需要设置一些字段。因为表单在每一步都保存，所以输入需要始终有效，但直到最后我才需要所需的验证（在submit）。

表单正在构建特定于其所在页面的动态验证列表，例如：

$(document).ready(function() {
    $("#ctl01").validate({ onsubmit: false });
    $("#_Qn_0e868ebe").rules("add", { maxlength: 200 });
    $("#_Qn_d69e75a4").rules("add", { number: true });
    $("#_Qn_adffbdec").rules("add", { maxlength: 200 });
    $("#_Qn_adffbdec").rules("add", { digits: true });
});

所以现在，对于必填字段，我已经为它们添加了一个 .isrequired 类，并且我已经解耦了 <asp:linkbutton>s 来触发这个客户端脚本：

function FormIsValid(sender, ishardsubmit) {
    var form = $("#ctl01");
    form.validate();
    if (form.valid()) {
        //if (ishardsubmit) {
        //    if (!IsRequiredValid()) { return false; }
        //}
        __doPostBack(sender, '');
    }
    return;
}

到目前为止，这部分（输入验证部分）运行良好。我注释掉的部分是工作不太好的部分。它触发了这个函数，我试图在其中动态添加所需的验证器并重新评估表单。我可以看到它为我的每个必填字段点击了 .each 循环，但它似乎不起作用，因为它通过 true 返回，即使必填字段为空。

function IsRequiredValid() {
    var $requiredgroup = $(".isrequired");
    $requiredgroup.each(function (i, item) {
        $(item).rules("add", { required: true });
    });
    form.validate();
    return form.valid();
}

我曾想过将 .net 所需的字段验证器放入其中以完成此部分，但如果可能的话，我想坚持使用单一解决方案。尤其是因为这感觉如此接近工作了。

想法？帮助？谢谢！

Answer 1

您的 jQuery .each() 方法构造不正确。

您希望在迭代中定位整个对象，而不是键/值对。所以从函数参数中删除i, item 并使用$(this) 作为目标选择器。

function IsRequiredValid() {
    var $requiredgroup = $(".isrequired");
    $requiredgroup.each(function() {
        $(this).rules("add", { required: true });
    });
    // form.validate(); // remove this line -> 100% superfluous
    return form.valid();
}

---

关于您在这两个函数中的form.validate() 行：您不能在页面上多次调用.validate()。它只是为了在表单上初始化插件而被调用一次。

以后调用它不会有任何效果。否则，我们不需要使用.rules() 方法，因为我们只需在需要更改规则时调用.validate()。但是，绝对不是这样的。

Answer 2

向您的必填字段添加一个类，例如：“SubmitRequired” 实现如下两个函数：

function SaveClick(){
//ignore SubmitRequired on save (and any disabled fields)
  $("form").validate({ ignore: ".SubmitRequired, [disabled]" });  

  if $("form").valid()
  {
    do something;
  }
}

function SubmitClick(){
//ignore only disabled fields (if any))
  $("form").validate({ ignore: "[disabled]" });  

  if $("form").valid()
  {
    do something;
  }
}