Question

我有一个包含四个不同字段集的表单。对于jQuery验证，我希望每个字段集中输入的错误都放在特定字段集顶部的错误块中。例如：

<fieldset id="contact">
  <legend>Contact Information</fieldset>
  <ul id="errors_contact" class="messages"></ul>
  <!-- input elements -->
</fieldset>

<fieldset id="financial">
    <legend>Financial Information</legend>
    <ul id="errors_financial" class="messages"></ul>
    <!-- input elements -->
</fieldset>

这可以通过jQuery验证来完成吗？

Answer 1

它无法专门使用errorLabelContainer，代码中有errorLabelContainer的一个设置/存储，但是您可以使用the errorPlacement and wrapper options代替效果你想要的，例如：

$("form").validate({
  wrapper: "li",
  errorPlacement: function(label, elem) {
    elem.closest("fieldset").find(".messages").append(label);
  }
});

而不是标准.insertAfter()（通常将<label>置于其后的元素之后），将其包装在<li></li>中并将其附加到.messages容器对于当前的<fieldset>。

Answer 2

我是这样做的：

我有一个必须验证多个控件的表单 - 但我想要一个错误区域 - 一条消息全部 - 一行。

默认如果你使用errorLabelContainer它将验证作为“附加组件” - 即多次验证在errorlabel中创建许多行。我注意到一件事 - 如果它的labelcontainer高度小于30px，它第二次创建一个新的空行。我不知道为什么。

在我的情况下，它是一个标签 - 但它当然也可以是一个div。在我的HTML中我有这个（假设你有jQuery validation.js和base）：

Myform是表单的名称 - 然后是不同的HTML控件 - 任何类型 - 例如：

INPUT id=theNameofcontrol type=checkbox name=theNameofcontrol validate=required:true

然后是错误消息的容器（不知道如何让它看起来像HTML :)

label id=errorlabel name=errorlabel style=font-size:1.3em;height:30;color:red; /label

在我的表单的onclick函数中，我将空消息作为errormessages并在表单无效时发出消息，如果不是则返回false（所以我不发布它。）

当然，您只需填写每条自定义消息即可 - 但无论有多少错误，我都想拥有一行。

$("#MyForm").validate(<br>
{<br>
errorLabelContainer:"#errorlabel",<br>
messages : <br>
    {theNameofcontrol: {required: "" },<br>
    theNameofcontrol2: {required: "" },<br>
    theNameofcontrol3: {required: "" }<br>
    }   <br>
);<br>
<br>
 if(! $("#MyForm").valid())<br>
{<br>
$("#errorlabel").html("My message when not all contols are valid!");<br>
return false;<br>
}

希望这对你有所帮助。如果组中有所有“对象”的容器，则应该能够对字段集执行相同的操作。

验证您使用的一个控件：

$("#MyForm").validate({errorLabelContainer:"#errorlabel",messages :{theNameofcontrol: {required: "This has to have a value" }}}).element("#theNameofcontrol");

祝你好运

jQuery验证 - 使用多个errorLabelContainer

2 个答案: