接下来声明了一个Spry XMLDataSet实例，此处我们将它命名为dsEmployees。初始化要求两个参数：XML文件的位置和一个用来识别XML节点或包含数据的节点的XPath表达式。XML还可以从一个URL加载。注意XPath表达式识别XML的根节点，然后是代表每行数据的子节点。
<title>Spry Simple Data Example</title>
<script type="text/javascript" src="includes/xpath.js"></script>
<script type="text/javascript" src="includes/SpryData.js"></script>
<script type="text/javascript">
var dsEmployees = newSpry.Data.XMLDataSet("assets/employee_data.xml", "employees/employee");
</script>
</head>
在页面的主体部分输出Spry数据集很简单。Spry动态区用于在页面上显示XML数据，当数据集改变时它们会同时更新。一个动态区使用spry:region在一个div标记中声明，HTML标记作为动态区容器。动态区是Spry数据集的一个“观测区”，打括号用来区别数据集中的每个列，spry:repeat标记迭代显示数据集中的所有行。
<div id="Employees_DIV" spry:region="dsEmployees">
<table id="Employees Table">
<tr>
<th>Name</th>
<th>Department</th>
<th>Email</th>
</tr>
<tr spry:repeat="dsEmployees">
<td> </td>
<td></td>
<td><a href="mailto:"></a></td>
</tr>
</table>
</div>
Spry有处理来自一个或多个数据集的主要/详细动态区的规定。下面的样例代码和上面一样使用相同的逻辑在head标记中声明了一个Spry数据集。
Spry XMLDataSet的setCurrentRow方法中对重复的数据表行添加了一个单击事件，传递当前行的id作为参数。第二个数据表用一个div标记围起来，其中使用了spry:detailregion来形成代码的详细部分。利用列表对数据表排序十分简单。
<div id="Employees_DIV" spry:region="dsEmployees">
<table id="Employees Table">
<tr>
<th>Name</th>
</tr>
<tr spry:repeat="dsEmployees" onclick="dsEmployees.setCurrentRow('')">
<td> </td>
</tr>
</table>
</div>
<div id="Employee_Detail_DIV" spry:detailregion="dsEmployees">
<table id="Employee Detail Table" border="1">
<tr>
<th>Name</th>
<th>Department</th>
<th>Email</th>
<th>Mobile Phone</th>
</tr>
<tr>
<td> </td>
<td></td>
<td><a href="mailto:"></a></td>
<td></td>
</tr>
</table>
</div>
查看本文来源
