Question

尝试使用jQuery Validator plugin验证表单时遇到麻烦。因此，在这种情况下，我构造了一个div表（不是表元素，而是div样式化为表），其中每行本质上都是其自己的完整表单，带有任何表单控件。

但是，由于该表可能具有数百行，因此，我不希望将每个行元素包装成自己的单独形式的开销。因此，我想到了一个方法，其中save方法只是将行本身作为arg，以便在后台创建/验证/提交表单。

我要做的基本上是克隆行并将克隆附加到我创建的新表单上

$("<form></form>").append(clonedRow);

然后，我得到结果变量（窗体）并设置验证。验证选项/设置如下：

form.validate({
    rules: {
        Follow_Up_Code: { required: true, maxlength: 2 }
    },
    messages: {
        Follow_Up_Code: { required: "...", maxlength: "..." }
    },
    submitHandler: function(){...}
});

目前，我只想针对这一行中的一个输入进行验证以进行测试。这是输入标记：

<input type="text" class="get set input" name="Follow_Up_Code" style="width: 100%;">

表单运行.validate（）之后，我立即提交表单。但是，对于我的测试用例，表单每次通过验证并运行在验证器中设置的SubmitHandler。

这使我认为，我想使用此插件进行验证的任何表单都必须附加到DOM上才能正确验证。但是我没有找到任何文档。我想知道是否有一种方法可以解决此问题，或者是否最好为此目的查找/创建自己的验证服务。

Answer 1

经过测试，我发现了这一点。是的，表单需要以某种形式附加到DOM。但是，您可以轻松而轻松地解决此问题：

form.css({ position: "absolute", visibility: "hidden", left: "-5000px" });
$("body").append(frm);
frm.submit();

这样，当用户将其放置在DOM上时，用户将无法看到该表单或与之交互。

这将完成工作并验证表单。但是，在这种情况下，如果我想在原始表上显示任何验证错误。我必须在安装时从validator's invalidHandler option内部访问无效的控件。从那里，我只需要在我想要的位置恰好插入错误消息即可。

说完一切之后，最好销毁验证器并将其从DOM中删除。我认为在提交处理程序和无效处理程序的结尾处执行此操作将是解决此问题的最佳方法。

jQuery Validator：验证未附加到DOM

1 个答案: