Ext.Net学习笔记13：Ext.Net GridPanel Sorter用法

这篇笔记将介绍如何使用Ext.Net GridPanel 中使用Sorter。

默认情况下，Ext.Net GridPanel中的列都具有排序功能，效果如下：

如果要禁用列排序，需要在列模型中添加一个属性Sortable="false"

客户端排序

排序是对Store的操作。如果我们要在一个Store中加入排序，可以使用下面的配置：

<Sorters>

    <ext:DataSorter Property="Name" Direction="DESC"></ext:DataSorter>

</Sorters>

有了这段代码，我们的Store将会在显示之前进行排序。效果如下：

服务器端排序

默认情况下，排序是在客户端进行的，不会进行远程请求。如果Store一次加载了所有数据，客户端排序没有问题；如果Store是分页异步加载数据，那么这种排序方式就不能满足需要了，我们需要异步的排序。

我们来将Store改为异步分页的Store，代码如下：

<ext:Store runat="server" ID="storeUserInfo" PageSize="5" 

    RemoteSort="true" OnReadData="storeUserInfo_ReadData">

    <Model>

        <ext:Model ID="UserInfoModel" runat="server" IDProperty="ID">

            <Fields>

                <ext:ModelField Name="ID" Type="Int"></ext:ModelField>

                <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>

    <Sorters>

        <ext:DataSorter Property="Name" Direction="DESC"></ext:DataSorter>

    </Sorters>

</ext:Store>

我们对Store进行修改，加入了RemoteSort属性，表示是否进行远程排序，然后加入默认的排序规则，Property表示排序字段，Direction表示排序方向（正序、倒序）

OnReadData事件的处理方法如下：

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();

}

上面的这段代码只是完成了Store的异步分页，如果想要我们的Store进行服务器端的排序，还需要修改ReadData事件处理方法，加入排序的代码：

//处理排序的相关代码

if (e.Sort.Count() > 0)

{

    foreach (var item in e.Sort)

    {

        switch (item.Property)

        {

            case "Name":

                userInfoList.Sort((u1, u2) =>

                {

                    switch (item.Direction)

                    {

                        case Ext.Net.SortDirection.Default:

                        case Ext.Net.SortDirection.ASC:

                        default:

                            return string.Compare(u1.Name, u2.Name);

                        case Ext.Net.SortDirection.DESC:

                            return 0 - string.Compare(u1.Name, u2.Name);

                    }

                });

                break;

            case "Age":

                userInfoList.Sort((u1, u2) =>

                {

                    switch (item.Direction)

                    {

                        case Ext.Net.SortDirection.Default:

                        case Ext.Net.SortDirection.ASC:

                        default:

                            return u1.Age - u2.Age;

                        case Ext.Net.SortDirection.DESC:

                            return u2.Age - u1.Age;

                    }

                    

                });

                break;

        }

    }

}

在这段代码中，item.Property表示排序字段；item.Direction表示排序方向。

如果在.ashx中使用排序，可以先构造一个请求参数，然后使用上面的代码进行排序：

var prms = new StoreRequestParameters(context);

// use prms.Sort[0].Property and prms.Sort[0].Direction

通过context构造一个请求参数，然后可以获取参数里面的Sort数组。

起飞网原创首发，转载请注明出处。

原文链接：Ext.Net学习笔记13：Ext.Net GridPanel Sorter用法