XForms/多列选择
< XForms
有时您需要从大量项目中进行选择，例如，您想要在搜索中包含一个州内的多个县之一。在以下示例中，搜索中可能包含 87 个县。这些县名按七列排列，除最后一列外，所有列都包含 13 个县。
这是一个示例程序。如果您想复制粘贴代码，请确保将页面置于编辑模式。这是因为 Wiki 软件会将 < 分号替换为 "&"。
<html
xmlns="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
xmlns:ev="http://www.w3.org/2001/xml-events">
<head>
<title>Select County</title>
<style type="text/css">
@namespace xf url("http://www.w3.org/2002/xforms");
body {
font-family: Helvetica, sans-serif;
font-size: 10pt;
}
.table-container {
display: table-row;
}
.table-cell {
display: table-cell;
vertical-align: top;
}
xf|label {
font-weight: bold;
}
</style>
<xf:model>
<xf:instance xmlns="">
<data>
<counties1>anoka carver</counties1>
<counties2>dakota</counties2>
<counties3>hennepin</counties3>
<counties4>mower</counties4>
<counties5>ramsey</counties5>
<counties6>scott</counties6>
<counties7>washington</counties7>
<counties />
</data>
</xf:instance>
<xf:bind nodeset="counties"
calculate="concat(../counties1, ' ', ../counties2, ' ',
../counties3, ' ', ../counties4,' ', ../counties5, ' ',
../counties6, ' ',../counties7)" />
</xf:model>
<xf:model id="code-tables">
<xf:instance xmlns="" id="MNCountyCode" src="counties.xml" />
</xf:model>
</head>
<body>
<p>Select all counties to include in the search:</p>
<div class="table-container ">
<div class="table-cell">
<xf:select ref="counties1" appearance="full">
<xf:itemset model="code-tables"
nodeset="instance('MNCountyCode')/EnumeratedValues/Item[boolean(position() < 14)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties2" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 13) and (position() < 27)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties3" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 26) and (position() < 40)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties4" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 39) and (position() < 53)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties5" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 52) and (position() < 66)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties6" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 65) and (position() < 79)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
<div class="table-cell">
<xf:select ref="counties7" appearance="full">
<xf:itemset model="code-tables" nodeset="instance('MNCountyCode')/EnumeratedValues/Item[(position() > 78)]">
<xf:label ref="Label" />
<xf:value ref="Value" />
</xf:itemset>
</xf:select>
</div>
</div>
<xf:output ref="counties">
<xf:label>Counties selected: </xf:label>
</xf:output>
</body>
</html>
以下是所有表单使用的共享资源文件。请注意，值中不包含任何空格。这样，代码就可以通过使用空格作为分隔符的系统传递。
<CodeTable>
<DataElementName>MNCountyCode</DataElementName>
<EnumeratedValues>
<Item>
<Label>Aitkin</Label>
<Value>aitkin</Value>
</Item>
<Item>
<Label>Anoka</Label>
<Value>anoka</Value>
</Item>
<Item>
<Label>Becker</Label>
<Value>becker</Value>
</Item>
<Item>
<Label>Beltrami</Label>
<Value>beltrami</Value>
</Item>
<Item>
<Label>Benton</Label>
<Value>benton</Value>
</Item>
<Item>
<Label>Big Stone</Label>
<Value>big-stone</Value>
</Item>
<Item>
<Label>Blue Earth</Label>
<Value>blue-earth</Value>
</Item>
<Item>
<Label>Brown</Label>
<Value>brown</Value>
</Item>
<Item>
<Label>Carlton</Label>
<Value>carlton</Value>
</Item>
<Item>
<Label>Carver</Label>
<Value>carver</Value>
</Item>
<Item>
<Label>Cass</Label>
<Value>cass</Value>
</Item>
<Item>
<Label>Chippewa</Label>
<Value>chippewa</Value>
</Item>
<Item>
<Label>Chisago</Label>
<Value>chisago</Value>
</Item>
<Item>
<Label>Clay</Label>
<Value>clay</Value>
</Item>
<Item>
<Label>Clearwater</Label>
<Value>clearwater</Value>
</Item>
<Item>
<Label>Cook</Label>
<Value>cook</Value>
</Item>
<Item>
<Label>Cottonwood</Label>
<Value>cottonwood</Value>
</Item>
<Item>
<Label>Crow Wing</Label>
<Value>crow-wing</Value>
</Item>
<Item>
<Label>Dakota</Label>
<Value>dakota</Value>
</Item>
<Item>
<Label>Dodge</Label>
<Value>dodge</Value>
</Item>
<Item>
<Label>Douglas</Label>
<Value>douglas</Value>
</Item>
<Item>
<Label>Faribault</Label>
<Value>faribault</Value>
</Item>
<Item>
<Label>Fillmore</Label>
<Value>fillmore</Value>
</Item>
<Item>
<Label>Freeborn</Label>
<Value>freeborn</Value>
</Item>
<Item>
<Label>Goodhue</Label>
<Value>goodhue</Value>
</Item>
<Item>
<Label>Grant</Label>
<Value>grant</Value>
</Item>
<Item>
<Label>Hennepin</Label>
<Value>hennepin</Value>
</Item>
<Item>
<Label>Houston</Label>
<Value>houston</Value>
</Item>
<Item>
<Label>Hubbard</Label>
<Value>hubbard</Value>
</Item>
<Item>
<Label>Isanti</Label>
<Value>isanti</Value>
</Item>
<Item>
<Label>Itasca</Label>
<Value>itasca</Value>
</Item>
<Item>
<Label>Jackson</Label>
<Value>jackson</Value>
</Item>
<Item>
<Label>Kanabec</Label>
<Value>kanabec</Value>
</Item>
<Item>
<Label>Kandiyohi</Label>
<Value>kandiyohi</Value>
</Item>
<Item>
<Label>Kittson</Label>
<Value>kittson</Value>
</Item>
<Item>
<Label>Koochiching</Label>
<Value>koochiching</Value>
</Item>
<Item>
<Label>Lac Qui Parle</Label>
<Value>lac-qui-parle</Value>
</Item>
<Item>
<Label>Lake</Label>
<Value>lake</Value>
</Item>
<Item>
<Label>Lake of the Woods</Label>
<Value>lake-of-the-woods</Value>
</Item>
<Item>
<Label>Lesueur</Label>
<Value>lesueur</Value>
</Item>
<Item>
<Label>Lincoln</Label>
<Value>lincoln</Value>
</Item>
<Item>
<Label>Lyon</Label>
<Value>lyon</Value>
</Item>
<Item>
<Label>Mahnomen</Label>
<Value>mahnomen</Value>
</Item>
<Item>
<Label>Marshall</Label>
<Value>marshall</Value>
</Item>
<Item>
<Label>Martin</Label>
<Value>martin</Value>
</Item>
<Item>
<Label>McLeod</Label>
<Value>mcleod</Value>
</Item>
<Item>
<Label>Meeker</Label>
<Value>meeker</Value>
</Item>
<Item>
<Label>Mille Lacs</Label>
<Value>mille-lacs</Value>
</Item>
<Item>
<Label>Morrison</Label>
<Value>morrison</Value>
</Item>
<Item>
<Label>Mower</Label>
<Value>mower</Value>
</Item>
<Item>
<Label>Murray</Label>
<Value>murray</Value>
</Item>
<Item>
<Label>Nicollet</Label>
<Value>nicollet</Value>
</Item>
<Item>
<Label>Nobles</Label>
<Value>nobles</Value>
</Item>
<Item>
<Label>Norman</Label>
<Value>norman</Value>
</Item>
<Item>
<Label>Olmsted</Label>
<Value>olmsted</Value>
</Item>
<Item>
<Label>Otter Tail</Label>
<Value>otter-tail</Value>
</Item>
<Item>
<Label>Pennington</Label>
<Value>pennington</Value>
</Item>
<Item>
<Label>Pine</Label>
<Value>pine</Value>
</Item>
<Item>
<Label>Pipestone</Label>
<Value>pipestone</Value>
</Item>
<Item>
<Label>Polk</Label>
<Value>polk</Value>
</Item>
<Item>
<Label>Pope</Label>
<Value>pope</Value>
</Item>
<Item>
<Label>Ramsey</Label>
<Value>ramsey</Value>
</Item>
<Item>
<Label>Red Lake</Label>
<Value>red-lake</Value>
</Item>
<Item>
<Label>Redwood</Label>
<Value>redwood</Value>
</Item>
<Item>
<Label>Renville</Label>
<Value>renville</Value>
</Item>
<Item>
<Label>Rice</Label>
<Value>rice</Value>
</Item>
<Item>
<Label>Rock</Label>
<Value>rock</Value>
</Item>
<Item>
<Label>Roseau</Label>
<Value>roseau</Value>
</Item>
<Item>
<Label>Saint Louis</Label>
<Value>saint-louis</Value>
</Item>
<Item>
<Label>Scott</Label>
<Value>scott</Value>
</Item>
<Item>
<Label>Sherburne</Label>
<Value>sherburne</Value>
</Item>
<Item>
<Label>Sibley</Label>
<Value>sibley</Value>
</Item>
<Item>
<Label>Stearns</Label>
<Value>stearns</Value>
</Item>
<Item>
<Label>Steele</Label>
<Value>steele</Value>
</Item>
<Item>
<Label>Stevens</Label>
<Value>stevens</Value>
</Item>
<Item>
<Label>Swift</Label>
<Value>swift</Value>
</Item>
<Item>
<Label>Todd</Label>
<Value>todd</Value>
</Item>
<Item>
<Label>Traverse</Label>
<Value>traverse</Value>
</Item>
<Item>
<Label>Wabasha</Label>
<Value>wabasha</Value>
</Item>
<Item>
<Label>Wadena</Label>
<Value>wadena</Value>
</Item>
<Item>
<Label>Waseca</Label>
<Value>waseca</Value>
</Item>
<Item>
<Label>Washington</Label>
<Value>washington</Value>
</Item>
<Item>
<Label>Watonwan</Label>
<Value>watonwan</Value>
</Item>
<Item>
<Label>Wilkin</Label>
<Value>wilkin</Value>
</Item>
<Item>
<Label>Winona</Label>
<Value>winona</Value>
</Item>
<Item>
<Label>Wright</Label>
<Value>wright</Value>
</Item>
<Item>
<Label>Yellow Medicine</Label>
<Value>yellow-medicine</Value>
</Item>
</EnumeratedValues>
</CodeTable>
理想的做法是使用样式表将项目倒入表格的不同单元格中。不幸的是，关于如何将项目集结果样式化为不同表格的文档很少。