Ir al contenido

Visualización Condicional

De Wikilibros, la colección de libros de texto de contenido libre.

motivación

[editar]

Usted tiene una lista de elementos que desea mostrar en el interior de un bucle de repetición. ¿Quieres algunos elementos a tener un estilo diferente, basado en el contenido de los productos.

método

[editar]

Usaremos los XForms elemento' 'grupo' para mostrar condicionalmente dentro de un epígrafe de la cuenta de repetición.

Ejemplo de XML Fragement

[editar]

Supongamos que el formulario tiene los siguientes datos en una instancia:

<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>

Display condicional de Artículos

[editar]

El siguiente texto será sólo de salida 'elemento2 cuando 'element1 tiene un valor de verdad ''.

<xf:repeat nodeset="//my-node">
   <xf:group ref=".[element1='true']">
      <xf:output ref="element2"/>
   </xf:group>
</xf:repeat>

La sintaxis '. [a =' b ']' dice que desde el nodo actual si el elemento 'a es igual al valor 'B, entonces la salida de los elementos dentro del grupo.

Formato condicional de los elementos

[editar]

Esta misma estrategia se puede utilizar para encerrar salida en div diferente o elementos 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>

En el ejemplo anterior, todos los nodos con element1 = 'true' tendrán 'class = "fuerte" a en la salida y cualquier elemento con 'element1 =' false' no tendrá el atributo de la salida.

Muestra XForms appliction

[editar]

Load XForms Application

Código Fuente

[editar]

En este ejemplo tenemos que mostrar una lista de sinónimos de un término específico. Los sinónimos están listadas y un término preferido se muestra con una fuente en negrita.

<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>
=== Synonym Set ===
       <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>

Discusion

[editar]

XForms 1.1 también incluye el 'si' atributo. Algunos XForms condicional puede usar esto para visualización de los elementos.


Plantilla:Auto navigation Plantilla:Auto category