Atlas SortBehavior实现客户端排序
然后,在ASPX页面中,我们需要考虑并定义如下三部分的内容:
1,一个ScriptManager控件,用来包含页面必须的Atlas Framework相关脚本文件。通常情况下,这也是每个Atlas页面必须包含的。
2,一个占位(place holder)的div(id为dataContents,见代码)。Atlas将会把渲染后的ListView放置于此。
3, 一个隐藏的div,用来放置ListView的模版。
1,一个ScriptManager控件,用来包含页面必须的Atlas Framework相关脚本文件。通常情况下,这也是每个Atlas页面必须包含的。
2,一个占位(place holder)的div(id为dataContents,见代码)。Atlas将会把渲染后的ListView放置于此。
3, 一个隐藏的div,用来放置ListView的模版。
下面是以上三部分内容的代码,关于ListView控件的模版,请参考我的这篇文章:使用ASP.NET Atlas ListView控件显示列表数据
<!-- ScriptManager -->
<atlas:ScriptManager runat="server" ID="scriptManager" />
![]()
<!-- Element for ListView (container) -->
<div id="dataContents">
</div>
![]()
<!-- Templates -->
<div style="visibility: hidden; display: none">
<div id="masterTemplate">
<table border="1" cellpadding="3" style="width:30em;">
<thead>
<tr>
<td><a href="#" id="sortId">ID</a></td>
<td><a href="#" id="sortName">Name</a></td>
<td><a href="#" id="sortTitle">Title</a></td>
</tr>
</thead>
<tbody id="masterItemTemplateParent">
<tr id="masterItemTemplate">
<td><span id="masterId"></span></td>
<td><span id="masterName"></span></td>
<td><span id="masterTitle"></span></td>
</tr>
</tbody>
</table>
</div>
</div>
最后该书写Atlas的XML脚本定义了,有如下四个部分:
第一部分:Atlas客户端控件DataSource,用来从我们上面定义的Web Service中取得数据。
<dataSource id="dataSource" autoLoad="true" serviceURL="SampleDataService.asmx" />
第二部分:一个DataView控件(请参考:Atlas命名空间Sys.Data下控件介绍——DataView和DataFilter ),用来将第一部分中取得的数据排序。
<dataView id="view">
<bindings>
<binding dataContext="dataSource" dataPath="data" property="data"/>
</bindings>
</dataView>
第三部分:一个ListView控件(请参考: 使用ASP.NET Atlas ListView控件显示列表数据 ) , 用于显示排序后的数据。
<listView id="dataContents" itemTemplateParentElementId="masterItemTemplateParent" >
<bindings>
<binding dataContext="view" dataPath="filteredData" property="data"/>
</bindings>
<layoutTemplate>
<template layoutElement="masterTemplate"/>
</layoutTemplate>
<itemTemplate>
<template layoutElement="masterItemTemplate">
<label id="masterId">
<bindings>
<binding dataPath="Id" property="text"/>
</bindings>
</label>
<label id="masterName">
<bindings>
<binding dataPath="Name" property="text"/>
</bindings>
</label>
<label id="masterTitle">
<bindings>
<binding dataPath="Title" property="text"/>
</bindings>
</label>
</template>
</itemTemplate>
</listView>
第四部分:三个包含SortBehavior behavior的Atlas控件,用来触发排序的操作。
<control id="sortId">
<behaviors>
<sortBehavior dataView="view" sortColumn="Id"/>
</behaviors>
</control>
<control id="sortName">
<behaviors>
<sortBehavior dataView="view" sortColumn="Name"/>
</behaviors>
</control>
<control id="sortTitle">
<behaviors>
<sortBehavior dataView="view" sortColumn="Title"/>
</behaviors>
</control>
0
相关文章
