I put a toggle inside a legend simply because it just popped in my head to try it. This same procedure could work with any type of grouped data without having a legend at all (see Switch/Case Toggle Template or Using Switch Case as a drop down box).
In my post Xforms: The Legendary Toggle
I use two cases with the Switch/Case method to get the effect I wanted–inside the cases are two triggers each with an xforms-toggle–one trigger hides while the other is visible, and vice versa.
However, one doesn’t need a switch/case at all but can rely on “relevance” to get the same effect, without as much coding, and by only using one, instead of two, triggers. Credit for this approach goes to the xforms administrator at xforms.org.
There is also a tip on how to toggle through a slideshow. Check it out, I really learned something. http://xforms.org/index.php?topic=177.0
I’m posting my own code here just for my own personal reference, but take a look at the other code on that site as well, –the administrator is an xforms expert, so you’ll learn much.
<?xml version="1.0" encoding="UTF-8"?>
<h:html xmlns:h="http://www.w3.org/1999/xhtml"
xmlns:ev="http://www.w3.org/2001/xml-events"
xmlns:xf="http://www.w3.org/2002/xforms">
<h:head>
<h:title>Test</h:title>
<xf:model id='mod2'>
<xf:instance id='inst2'>
<data xmlns="">
<toggleState>0</toggleState>
<toggleOn/>
<toggleOff/>
</data>
</xf:instance>
<xf:bind nodeset='toggleOn' relevant='//toggleState = 1'/>
<xf:bind nodeset='toggleOff' relevant='//toggleState = 0'/>
</xf:model>
<h:style type="text/css"><![CDATA[
fieldset {width:200px;paddding:5px;border:solid 1px blue;}
legend {padding:5px;background-color:red;color:white;font-weight:bold;border:outset 2px red;}
legend:active {border:inset 2px red;}
]]></h:style>
</h:head>
<h:body>
<xf:output ref="//toggleState"/>
<h:fieldset id="fs1">
<h:legend>
<xf:trigger appearance="minimal">
<xf:label>Toggle Set</xf:label>
<xf:setvalue model='mod2' ref='//toggleState'
value="if(number(.)=1,0,1)" ev:event="DOMActivate"/>
</xf:trigger>
</h:legend>
<xf:group model='mod2' ref='//toggleOff'>
</xf:group>
<xf:group model='mod2' ref='//toggleOn'>
<h:p>Something here .... yada yada</h:p>
</xf:group>
</h:fieldset>
</h:body>
</h:html>
[...] For another approach with the same effect see A better Legendary Toggle [...]
Pingback by Switch/Case Toggle Template « Clarkepeters’s Weblog — October 9, 2007 @ 9:12 pm