XForms/Binding in Repeats
Motivation
editYou have a list of items and you want a simple way of conditionally displaying fields within a repeated group.
Method
editWe will do this is two ways. First we will use a bind expression in the model. The second method of doing this will be to use a group element with a ref attribute.
Sample Data
edit<data xmlns="">
<group>
<code>yes</code>
<field>display 1</field>
</group>
<group>
<code>no</code>
<field>display 2</field>
</group>
<group>
<code>yes</code>
<field>display 3</field>
</group>
</data>
Sample Repeat
edit<xf:repeat nodeset="instance('my-data')/group" id="my-repeat">
<fieldset>
<legend>
Group # <xf:output value="count(preceding-sibling::*) +1"></xf:output>
</legend>
<xf:select1 ref="code">
<xf:label>Display Input Field: </xf:label>
<xf:item>
<xf:label>Yes</xf:label>
<xf:value>yes</xf:value>
</xf:item>
<xf:item>
<xf:label>No</xf:label>
<xf:value>no</xf:value>
</xf:item>
</xf:select1>
<xf:input ref="field" >
<xf:label>Conditional Display: </xf:label>
</xf:input>
</fieldset>
</xf:repeat>
Solution Using Relative Binds
editIn this example we use a relative statement to indicate that the field should only be displayed if the code value is "yes". Note that the context of the relevant expression is the result of each nodeset item.
<xf:bind id="field"
nodeset="instance('my-data')/group/field"
relevant="../code = 'yes'"/>
Solution Using Group Element
editWe can use the ref attribute to conditionally display any field within a repeat. We do this by starting the group ref attribute with "." to give it the current context. Then we add a predicate to turn on or off that entire group. In this case if the code is "yes" the input field will be displayed. If it is not the field will be hidden.
<xf:group ref=".[code='yes']">
<xf:input ref="field">
<xf:label>Conditional Display: </xf:label>
</xf:input>
</xf:group>
Complete Example
edit<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<title>Binds in Repeats</title>
<style type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
body {{
font-family:Helvetica, sans-serif;
}}</style>
<xf:model>
<xf:instance id="my-data">
<data xmlns="">
<group>
<code>yes</code>
<field>display 1</field>
</group>
<group>
<code>no</code>
<field>display 2</field>
</group>
<group>
<code>yes</code>
<field>display 3</field>
</group>
<group>
<code>no</code>
<field>display 4</field>
</group>
</data>
</xf:instance>
<xf:bind id="field"
nodeset="instance('my-data')/group/field"
relevant="../code = 'yes'"/>
</xf:model>
</head>
<body>
<h1>Test of binding rules within a repeat</h1>
<xf:repeat nodeset="instance('my-data')/group" id="my-repeat">
<fieldset>
<legend>
Group # <xf:output value="count(preceding-sibling::*) +1"></xf:output>
</legend>
<xf:select1 ref="code">
<xf:label>Display Input Field: </xf:label>
<xf:item>
<xf:label>Yes</xf:label>
<xf:value>yes</xf:value>
</xf:item>
<xf:item>
<xf:label>No</xf:label>
<xf:value>no</xf:value>
</xf:item>
</xf:select1>
<xf:input ref="field" >
<xf:label>Conditional Display: </xf:label>
</xf:input>
</fieldset>
</xf:repeat>
<xf:output value="index('my-repeat')">
<xf:label>Current Selected Group: </xf:label>
</xf:output>
</body>
</html>