在Visualforce页面的字段下方添加错误消息

Question

我在窗体中有两个字段。我在第一个字段中应用了使用javascript的各种自定义验证。因此，如果用户输入的值失败，我想在字段下方显示Error meassage但这里的问题是用户可以使用“添加行”按钮添加尽可能多的行。假设用户添加了3行。并且错误在第二行，“错误值”消息应该显示在下面第二行的字段。以下是我的代码中的一部分form.o如何显示错误使用JavaScript单独（不使用控制器类）。请帮助。

            <apex:outputPanel id="List"> 
                 <div id="repayid"> 
                  <table style="width:100%;display: block;overflow: scroll;" id="Table"> 
                   <tr id="Tabletr1"> 

                    <td class="A">Alpha No</td> 

                    <td class="A">BetaText</td> 


                   </tr> 

                   <apex:repeat value="{!List}" var="rep" id="addrow"> 
                    <tr id="repayTabletr2"> 


                     <td id ="tdid"> 
                      <apex:inputField value="{!rep.S_Code_No__c}" id="barid" style="width:100%;"/> 
                      <div style="color:red; background-color:white;"> 
                      <p class="SError" style="display:none;">Error Value </p> 
                      </div> 
                     </td> 

                     <td> 
                      <apex:inputField styleClass="RequiredField" value="{!rep.C_Code__c}" style="width:100%;"/> 
                      <div style="color:red; background-color:white;"></div> 
                     </td> 
                    </tr> 
                   </apex:repeat> 
                  </table> 
                 </div> 

Answer 1

您必须迭代javascript函数中的输入字段。在迭代每个字段时，您将拥有该字段的ID。

使用JavaScript和CSS，您可以在错误输入下面插入新的DIV，然后可以在该DIV中设置样式并显示错误消息。

或者，您可以在重复标记内添加一个空DIV，然后可以在发现错误时对其添加样式/添加innerHTML。