XForms, Folding Menus

Motivation

You want to display a complex list of choices in a tree structure where each branch could be opened and closed.

Sample Program

xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:xsd="http://www.w3.org/2001/XMLSchema"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:ev="http://www.w3.org/2001/xml-events">;

Folding Menus
id="modelID" ev:event="" functions="" schema="">
id="instanceData" xmlns="">
id="mainGroup">
id="group1" fold="0" category="Category One">
id="item1">Enter Data
id="item2">Enter Data
id="item3">Enter Data
id="group2" fold="0" category="Category Two">
id="item4">Enter Data
id="item5">Enter Data
id="group3" fold="0" category="Category Three">
id="item6">Enter Data
id="item7">Enter Data
id="item8">Enter Data

id="item9">Enter Data

id="foldedNodes" xmlns="">

/>

nodeset="descendant::*"
relevant="not(contains(instance('foldedNodes')/nodelist, current()/parent::*/@id))"
/>

type="text/css">
@namespace xhtml url("http://www.w3.org/1999/xhtml");
@namespace xf url("http://www.w3.org/2002/xforms");
xf|*:disabled {
display: none;
}

class="header">Folding Test

id="mainGroup">
ref="instance('foldedNodes')/nodelist">
ID List

nodeset="instance('instanceData')/descendant::group" id="repeatGroup">
class="outputInline"
value="concat(substring('                                                          ',1,3 * count(current()/ancestor::*)), '     ')" />

value="if(contains(instance('foldedNodes')/nodelist, ./@id), '+', '-')"
/>

ev:event="DOMActivate">
ref="instance('foldedNodes')/nodelist"
value="if(contains(instance('foldedNodes')/nodelist, instance('instanceData')/descendant::group[position()=index('repeatGroup')]/@id), concat(substring-before(instance('foldedNodes')/nodelist, instance('instanceData')/descendant::group[position()=index('repeatGroup')]/@id), substring-after(instance('foldedNodes')/nodelist, instance('instanceData')/descendant::group[position()=index('repeatGroup')]/@id)), concat(instance('foldedNodes')/nodelist, instance('instanceData')/descendant::group[position()=index('repeatGroup')]/@id))"
/>

class="outputInline" ref="./@category" />
nodeset="./item" id="repeatItem">
class="outputInline"
value="concat(substring('                                                          ',1,3 * count(current()/ancestor::*)), '     ')" />
class="outputInline" ref="./@id">
id:

class="inputInline" ref=".[name() = 'item' or name() = 'file']">
data:

Discussion

There are some interesteing XPath expressions in this example. For example the following counts
the number of ancestor nodes of the current node:

count(current()/ancestor::*)

The following gets all of the decendant groups within the instance data:

instance('instanceData')/descendant::group

The following returns a "+" if the nodelist contains the value in the id attribute and a "-" if it does not.

if(contains(instance('foldedNodes')/nodelist, ./@id), '+', '-')

Credits

Thanks to Fraser for posting this on the Mozilla XForms developer newsgroup in Oct. of 2007

Where this page came from

This page was imported from Wikibooks. From “XForms” on Wikibooks, by its contributors, under CC BY-SA 4.0. Changed here: set as a page; navigation and edit links left out; each image under its own licence, credited in its caption.

Nobody has written it yet — it is the source material at a new address, which is why search engines are asked to skip it and why no one earns from it. It is up for grabs: take it on, and it is yours to rewrite and to earn from.