如果能够确定是否在服务器端显示面板，则可以使用granite/ui/components/foundation/renderconditions/simple小部件检查条件。查询默认的AEM安装以获取示例，条件是在节点的expression属性中设置的granite:rendercondition。此示例检查QueryString，但是您可以检查其他内容，例如使用表达式语言（EL）的后缀，例如：${requestPathInfo.suffix == "/my/suffix"}。
<wizard>
<items jcr:primaryType="nt:unstructured">
...
<male
jcr:primaryType="nt:unstructured"
jcr:title="Male"
sling:resourceType="granite/ui/components/coral/foundation/wizard/lazycontainer"
src="...">
<parentConfig jcr:primaryType="nt:unstructured">
<next
granite:class="foundation-wizard-control"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/button"
disabled="{Boolean}true"
text="Next"
variant="primary">
<granite:data
jcr:primaryType="nt:unstructured"
foundation-wizard-control-action="next"/>
</next>
</parentConfig>
<granite:rendercondition
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/renderconditions/simple"
expression="${querystring == "gender=male"}"/>
</male>
<female
jcr:primaryType="nt:unstructured"
jcr:title="Female"
sling:resourceType="granite/ui/components/coral/foundation/wizard/lazycontainer"
src="...">
<parentConfig jcr:primaryType="nt:unstructured">
<next
granite:class="foundation-wizard-control"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/button"
disabled="{Boolean}true"
text="Next"
variant="primary">
<granite:data
jcr:primaryType="nt:unstructured"
foundation-wizard-control-action="next"/>
</next>
</parentConfig>
<granite:rendercondition
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/renderconditions/simple"
expression="${querystring == "gender=female"}"/>
</femail>
</items>
</wizard>
否则，在客户端，您可以简单地使用JavaScript显示和隐藏窗口小部件。在向导中，两个小部件不一定需要是两个不同的步骤。实际上，如果不这样做可能会更好，这样向导进度指示器将仅显示一个步骤，您可以在该步骤中更改显示。
CSS开始隐藏的字段：
.gender-male-fieldset, .gender-female-fieldset {
display: none;
}
对话框打开时运行的JavaScript，单击单选按钮时显示/隐藏字段集。这是一个简单的示例，您可以编写一些更可重用的东西：
$(document).on("dialog-ready", function() {
var $maleRadio = $('.gender-male-radio'),
$femaleRadio = $('.gender-female-radio'),
$maleFieldset = $('.gender-male-fieldset'),
$femaleFieldset = $('.gender-female-fieldset');
$maleRadio.click(function(){
$maleFieldset.show();
$femaleFieldset.hide();
})
$femaleRadio.click(function(){
$maleFieldset.hide();
$femaleFieldset.show();
})
});
触摸UI对话框，带有用于男性和女性的单选按钮和字段集。每个小部件都有一个自定义CSS类，可与您的jQuery选择器一起使用：
<gender
jcr:primaryType="nt:unstructured"
class="gender"
sling:resourceType="granite/ui/components/foundation/form/radiogroup"
fieldLabel="Gender">
<items jcr:primaryType="nt:unstructured">
<option1
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/radio"
class="gender-male-radio"
name="./gender"
text="Male"
value="male"/>
<option2
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/radio"
class="gender-female-radio"
name="./gender"
text="Female"
value="female"/>
</items>
</gender>
<male
jcr:primaryType="nt:unstructured"
jcr:title="Male"
class="gender-male-fieldset"
sling:resourceType="granite/ui/components/foundation/form/fieldset">
<items jcr:primaryType="nt:unstructured">
<headingText
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/textfield"
fieldLabel="Male fields"
name="./maleText"/>
</items>
</male>
<female
jcr:primaryType="nt:unstructured"
jcr:title="Female"
class="gender-female-fieldset"
sling:resourceType="granite/ui/components/foundation/form/fieldset">
<items jcr:primaryType="nt:unstructured">
<headingText
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/textfield"
fieldLabel="Female fields"
name="./femaleText"/>
</items>
</female>
602392714
清零编程群