为什么特定id的h:消息不能在动态表单中正确显示?更多描述

Question

我有一个表单，用户可以动态地从表单中添加和删除一组表单字段(名、姓和电子邮件)。这部分工作得很好，但当然我需要对这些字段进行一些验证，如果我只提交包含第一组字段的表单，它工作得很好，我对每个字段都进行了验证。添加下一组字段并提交后，我将获得第一组字段的验证消息，而第二组字段只有一个字段。我真的不知道发生了什么，但这是.xhtml文件的样子:

<h:form>
    <ui:repeat var="i" value="#{bean.list}">
        <h:panelGrid columns="5" rowClasses="newRoow">
             <h:inputText id="firstName" value="#{i.first_name}"
             required="true" requiredMessage="Please enter a First Name" />
             <h:inputText id="lastName" value="#{i.first_name}"
             required="true" requiredMessage="Please enter a LastName" />
             <h:inputText id="email" value="#{i.first_name}"
             required="true" requiredMessage="Please enter an Email Address"> />
             <h:commandButton value="+">
                 <f:ajax event="click" render="@form" 
                 listener="#{bean.addItemFromList}" />
             </h:commandButton>
             <h:commandButton value="-">
                 <f:ajax event="click" render="@form" 
                 listener="#{bean.removeItemFromList(i)}" />             
             </h:commandButton>
             <h:message for="firstName" errorClass="warnings" showSummary="true" />
             <h:message for="lastName" errorClass="warnings" showSummary="true" />
             <h:message for="email" errorClass="warnings" showSummary="true" />
        </h:panelGrid>
    </ui:repeat>
    <h:commandButton value="Submit"
    actionListener="#{bean.someFunction}"
    action="nextPage" />
</h:form>

你知道为什么会失败吗?

设置了第一个字段，它工作得很好，正如您在这里看到的:https://i.stack.imgur.com/P6mOv.png验证在每个字段的下面。

对于第二个和下面的字段集，它看起来像这样:https://i.stack.imgur.com/kZDHt.png或者有点不同，因为每次我按add按钮时，它似乎都要验证一个字段

Answer 1

我后来发现这不是我为这个问题编写的代码/标记的问题，而是来自包含的.js文件。这个.js中有一些代码，它与<h:messages />标签生成的class="warnings"的所有元素混淆。

Answer 2

在这里两个组件在同一个表单，而提交整个表单将被提交，所以你会得到验证错误消息。