Ext.Net学习笔记09:Ext.Net Store的用法
使用Handler处理分页
首先来创建一般处理程序,我命名为StoreHandler.ashx,然后它的处理过程代码如下:
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "application/json";
var requestParams = new StoreRequestParameters(context);
int start = requestParams.Start;
int limit = requestParams.Limit;
DataSorter[] sorter = requestParams.Sort;
DataFilter[] filter = requestParams.Filter;
Paging<UserInfo> employees = GetPageData(start, limit, filter, sorter);
context.Response.Write(JSON.Serialize(employees));
}
这个方法中,我们首先使用HttpContext创建一个StoreRequestParameters对象,这个对象中包含Start、Limit、Page、Sort、Filter、Group等参数。
- Start:从第几行开始获取数据记录
- Limit:获取数据的量,一次获取多少行数据
- Page:当前的页码
- Sort:排序的条件集合
- Filter:过滤的条件集合
- Group:分组的条件集合
我们在获取到这些数据以后,通过GetPageData来取到符合条件的数据,然后创建一个Paging<T>类的实例,这个类中包含了Data和TotalRecords两个重要的属性
- Data:IEnumerable<T>类型的数据集合
- TotalRecords:数据总行数,用于客户端分页(生成页码)
我们的获取数据方法的代码如下:
public Paging<UserInfo> GetPageData(int start, int limit,
DataFilter[] filter, DataSorter[] sorter)
{
var userInfoList = UserInfo.GetData();
Paging<UserInfo> result = new Paging<UserInfo>();
result.TotalRecords = userInfoList.Count;
result.Data = userInfoList.Skip(start).Take(limit).ToList();
return result;
}
有了这个handler,我们接下来需要对Store进行改造:
<ext:Store runat="server" ID="storeUserInfo" PageSize="5" RemoteFilter="true" RemoteSort="true">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="Name">
<Fields>
<ext:ModelField Name="Name" Type="String"></ext:ModelField>
<ext:ModelField Name="Gender" Type="String"></ext:ModelField>
<ext:ModelField Name="Age" Type="Int"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:AjaxProxy Url="StoreHandler.ashx">
<ActionMethods Read="GET" />
<Reader>
<ext:JsonReader Root="data" />
</Reader>
</ext:AjaxProxy>
</Proxy>
</ext:Store>
AjaxProxy的Url就是我们的Handler地址。ActionMethods是请求方式,JsonReader是reader属性,它获 取的数据根节点是data。这里都是根据ExtJS中ajaxproxy来定义的,你可以通过看我之前的文章来了解这方面的内容:ExtJS 4.2 教程-06:服务器代理(proxy)
PageProxy分页的实现
PageProxy是Ext.Net实现的一种分页方式,它与使用handler的方式不同,PageProxy通过实现OnReadData事件来完成分页。
这里我们直接看Store的代码:
<ext:Store runat="server" ID="storeUserInfo" PageSize="5" OnReadData="storeUserInfo_ReadData">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="Name" >
<Fields>
<ext:ModelField Name="Name" Type="String"></ext:ModelField>
<ext:ModelField Name="Gender" Type="String"></ext:ModelField>
<ext:ModelField Name="Age" Type="Int"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy></ext:PageProxy>
</Proxy>
</ext:Store>
然后再后台代码中实现storeUserInfo_ReadData:
protected void storeUserInfo_ReadData(object sender, Ext.Net.StoreReadDataEventArgs e)
{
int start = e.Start;
int limit = e.Limit;
var userInfoList = UserInfo.GetData();
e.Total = userInfoList.Count;
storeUserInfo.DataSource = userInfoList.Skip(start).Take(limit).ToList();
storeUserInfo.DataBind();
}
排序和过滤
在上面我们已经提到过,服务器端可以获得Sort和Filter参数,然后通过处理Sort和Filter来得到相应的数据。
例如我的Filter代码:
var userInfoList = UserInfo.GetData();
if (filter != null && filter.Count() > 0)
{
foreach (var item in filter)
{
userInfoList = userInfoList.FindAll(m => m.Name == item.Value);
}
}
这样可以过滤每一个都匹配的选项。Sort的代码比较复杂,目前还没有完成一个比较通用的,垃圾代码就不贴出来祸害大众了。