XForms/Elementos repetitivos
Motivacion
editarUsted tiene una lista de elementos y desea una forma sencilla de mostrar condicionalmente campos dentro de un grupo repetido.
Método
editarEsto se hace de dos maneras. En primer lugar vamos a utilizar una expresión de enlace en el modelo. El segundo método será el uso de un elemento del grupo con un atributo ref.
Datos de Ejemplo
editar
<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>
Ejemplo de Repetición
editar
<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>
Solución Usando Enlaces Relativos
editarEn este ejemplo se utiliza una declaración relativa a indicar que el campo sólo se muestra si el valor del código es "sí". Tenga en cuenta que el contexto de la expresión pertinente es el resultado de cada elemento de conjunto de nodos.
<xf:bind id="field"
nodeset="instance('my-data')/group/field"
relevant="../code = 'yes'"/>
Solución Utilizando Grupo de Elementos
editarPodemos usar el atributo ref para mostrar condicionalmente cualquier campo dentro de una repetición. Esto lo hacemos a partir del atributo ref grupo con "." para darle el contexto actual. A continuación, se añade un predicado para encender o apagar todo el grupo. En este caso, si el código es "sí", el campo de entrada en la pantalla. Si no es el campo estará oculta.
<xf:group ref=".[code='yes']">
<xf:input ref="field">
<xf:label>Conditional Display: </xf:label>
</xf:input>
</xf:group>
Ejemplo Completo
editar
<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>
= Test of binding rules within a repeat =
<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>