XForms, Select1 Multi-Column

Motivation

You want to select one item from multiple column of items.

Method

To do this we must unselect all of the column not selected so that only one column has a value in the output.

Source Code

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

Select1 Multi Column

type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
body {
font-family: Helvetica, sans-serif;
font-size: 10pt;
}

/* vertical align the selectors in each column. I am not sure why none of these CSS selectors work */
.state-selector tr td {
vertical-align:text-top;
align: top;
valign: top;
}

/* this is also not working */
.state-selector xf:label {
font-weight: bold;
}
]]>

xmlns="" id="cols">

nodeset="cols" calculate="concat(../col-1, ../col-2, ../col-3)"/>

id="log">
xmlns="">

ev:event="xforms-ready">
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'xforms-ready'"/>

Select1 Multi Column

border="1">

valign="top">
ref="col-1" appearance="full">

Red
red

Orange
orange

ev:event="DOMActivate">
ref="instance('cols')/col-2" value="''"/>
ref="instance('cols')/col-3" value="''"/>
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'col 1 xforms-value-changed'"/>

valign="top">
ref="col-2" appearance="full">

Yellow
yellow

Green
green

ev:event="DOMActivate">
ref="instance('cols')/col-1" value="''"/>
ref="instance('cols')/col-3" value="''"/>
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'col 2 xforms-value-changed'"/>

valign="top">
ref="col-3" appearance="full">

Blue
blue

Indigo
indigo

ev:event="DOMActivate">
ref="instance('cols')/col-1" value="''"/>
ref="instance('cols')/col-2" value="''"/>
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'col 3 xforms-value-changed'"/>

Clear
ev:event="DOMActivate">
ref="col-1" value="''"/>
ref="col-2" value="''"/>
ref="col-3" value="''"/>
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'clear'"/>

refresh
ev:event="refresh">
ref="col-1" value="''"/>
ref="col-2" value="''"/>
ref="col-3" value="''"/>
nodeset="instance('log')/event" at="last()" position="after"/>
ref="instance('log')/event[last()]" value="'refresh'"/>

ref="cols">
Color selected:

ref="col-1">
Column 1:

ref="col-2">
Column 2:

ref="col-3">
Column 3:

id="log">

Event Log

id="results-repeat" nodeset="instance('log')/event">
ref="."/>

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.