如何使 AUI 验证仅在选中复选框时应用？

Question

我有一个 aui 表单中的字段，我只想在选中相应的复选框时需要这些字段，否则不需要它们。<aui:script>一旦启用复选框，我将启用这些输入字段，只有这样 aui 验证才可以工作。

我尝试过隐藏<aui:validator>脚本中的依赖条件。

仅当在 aui 中选中我的复选框时，如何启用验证？

<aui:form action="" method="post">
<aui:input type="checkbox" name="employeeId" id="employeeId"></aui:input>

<div id="employeeDetails">
    <aui:input type="text" name="name" id="employeeId2">
        <%
            if (true) { //default i kept true how to check this condition on check box basic
        %>
        <aui:validator name="required"'  />
        <%
            }
        %>
    </aui:input>
    <aui:input type="text" name="email" id="employeeId3">
        <%
            if (true) {
        %>
        <aui:validator name="required" />
        <%
            }
        %>

    </aui:input>
</div>
<aui:button-row>
    <aui:button type="submit" />
</aui:button-row>
</aui:form>

<aui:script>
AUI().use('event', 'node', function(A) {
   A.one('#employeeDetails').hide(); // to hide div by default

   var buttonObject = A.all('input[type=checkbox]');
   buttonObject.on('click', function(event) {
     if (A.one("#<portlet:namespace/>employeeId").attr('checked')) { 
        A.one('#employeeDetails').show(); //for checked condition
     } else {
        A.one('#employeeDetails').hide(); // for non checked condition
     } 
   });
});
</aui:script>

参考图片：

启用复选框之前

[]

启用复选框：

[]

Answer 1

这个示例if(true)让我很困扰 - 它在 JSP 上的服务器端进行评估，不会产生任何效果，因为true总是true.

\n\n

但是，您的问题在Liferay 的文档中有详细记录：查找“有条件需要字段”

\n\n

\n

有时您\xe2\x80\x99会想要根据另一个字段的值验证一个字段。您可以通过在所需验证器\xe2\x80\x99s 主体内的 JavaScript 函数中检查该条件来完成此操作。

\n\n

下面是一个配置示例：

\n\n

<aui:input label="My Checkbox" name="myCheckbox" type="checkbox" />\n\n<aui:input label="My Text Input" name="myTextInput" type="text">\n  <aui:validator name="required">\n    function() {\n      return AUI.$(\'#<portlet:namespace />myCheckbox\').prop(\'checked\');\n    }\n  </aui:validator>\n</aui:input>\n

\n

\n