XForms/条件样式
外观
< XForms
您有一个项目列表,您想在重复循环内显示这些项目。您希望某些项目根据其内容进行不同的样式设置。
我们将使用 XForms 的 group 元素在重复语句中条件显示一个项目。
假设您的表单在实例中具有以下数据
<my-nodes>
<my-node>
<element1>true</element1>
<element2>Element2 Value</element2>
</my-node>
<my-node>
<element1>false</element1>
<element2>Element2 Value</element2>
</my-node>
<my-node>
<element1>true</element1>
<element2>Element2 Value</element2>
</my-node>
</my-nodes>
当 element1 的值为 true 时,以下文本将仅输出 element2。
<xf:repeat nodeset="//my-node">
<xf:group ref=".[element1='true']">
<xf:output ref="element2"/>
</xf:group>
</xf:repeat>
语法 .[a='b'] 表示从当前节点开始,如果元素 a 等于值 b,则输出组内的元素。
相同的策略可用于将输出包含在不同的 div 或 span 元素中。
<xf:repeat nodeset="my-node">
<xf:group ref=".[element1='true']">
<xf:output ref="element2" class="strong"/>
</xf:group>
<xf:group ref=".[element1='false']">
<xf:output ref="element2"/>
</xf:group>
</xf:repeat>
在上面的示例中,所有具有 element1='true' 的节点将在输出中具有 class="strong" 属性,而任何具有 element1='false' 的元素在输出中将没有该属性。
在此示例中,我们需要显示特定术语的同义词列表。所有同义词都列出,首选术语以粗体显示。
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ev="http://www.w3.org/2001/xml-events"
xmlns:xsd="http://www.w3.org/2001/XMLSchema"
xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Conditional Display</title>
<style type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
body {font-family:Helvetica, sans-serif}
.strong {font-weight:bold;}
/* this puts everything under the repeat element into a single line */
xf|repeat * {display:inline;}
</style>
<xf:model>
<xf:instance xmlns="" id="current-synset">
<data>
<synset-id>3</synset-id>
<synonym>
<preferred>false</preferred>
<syn-name>Boolean-Value</syn-name>
</synonym>
<synonym>
<preferred>false</preferred>
<syn-name>Conditional-Value</syn-name>
</synonym>
<synonym>
<preferred>false</preferred>
<syn-name>Flag</syn-name>
</synonym>
<synonym>
<preferred>true</preferred>
<syn-name>Indicator</syn-name>
</synonym>
<synonym>
<preferred>false</preferred>
<syn-name>Yes/No-Value</syn-name>
</synonym>
</data>
</xf:instance>
</xf:model>
</head>
<body>
<h3>Synonym Set</h3>
<span>(preferred term is bold)</span><br/>
<xf:label>Synonyms: </xf:label>
<xf:repeat nodeset="instance('current-synset')/synonym" id="repeat">
<xf:group ref=".[preferred='true']">
<xf:output ref="syn-name" class="strong"/>
</xf:group>
<xf:group ref=".[preferred='false']">
<xf:output ref="syn-name"/>
</xf:group>
</xf:repeat>
</body>
</html>
XForms 1.1 还包括 if 属性。某些 XForms 可以有条件地使用它来显示元素。