技术开发 频道

Atlas SortBehavior实现客户端排序

    然后,在ASPX页面中,我们需要考虑并定义如下三部分的内容:

    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
相关文章