EasyUI - DataGrid 组建 - [ 排序功能 ]

效果：

红框的字段看，为设置了，列排序，向后台Post数据sort/order。

 

原理：向后台POST数据，sort/post数据。

 

html代码：

            <table id="tab"></table>

 

JS代码：

$(function () {
    $('#tab').datagrid({
        width: 500,//宽度
        title: '信息列表',//标题名
        iconCls: 'icon-search',//图标
        singleSelect: true,//是否单选
        striped: true,//是否开启斑马线




        //============================= 加载数据，要显示的字段 =========================================//
        //要加载的数据
        url: "../Json/datagridjson.ashx",
        //要显示的列
        columns: [[
            { field: 'id', title: '编号' },
            { field: 'name', title: '姓名' },
            { field: 'sex', title: '性别' },
            //在字段中使用排序，每点击一次，都会向后台POST要排序的字段和正序还是倒序排列。
            { field: 'createtime', title: '创建时间',sortable:true, }
        ]],
        //==========================================================================================//





        //===================================== 分页 ===============================================//
        //显示分页控件栏
        pagination: true,
        pageNumber: 1,//初始化的时候在第几页
        pageSize: 5,//，每页显示的条数
        pageList: [5, 10, 15],//每页显示的条数
        //==========================================================================================//





        //===================================== 排序 ===============================================//
        //通过POST传递到后台，然后进行排序。
        sortName: 'createtime',
        sortOrder: 'desc',
        //==========================================================================================//





    });
})

 

一般处理程序（ashx）后台数据：

• 要修改的SQL语句：
•   order by " + sortfield + " " + sortDescOrasc + " 
•  (select ROW_NUMBER() over(order by " + sortfield + " " + sortDescOrasc + ") 

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "application/json";


            //接受前台传递来的页数和每页显示的条数
            //前台开启分页之后，传递来的参数
            int pageIndex = Convert.ToInt32(context.Request["page"]);
            int pagenumber = Convert.ToInt32(context.Request["rows"]);


            //接收排序字段
            string sortfield = context.Request["sort"];
            string sortDescOrasc = context.Request["order"];

            //存储数据
            DataTable dt = new DataTable();

            if (pageIndex == 1)
            {
                //加载第一页
                string pageIndexOne = "select top " + pagenumber + " id, name, sex, createtime from Tb_person order by " + sortfield + " " + sortDescOrasc + "";
                //获取数据
                dt = SQLHelper.ExecuteTable(pageIndexOne, CommandType.Text);
            }
            else if (pageIndex != 1)
            {
                //加载非第一页
                string pageIndexNotOne = @"select id, name, sex, createtime from (select ROW_NUMBER() over(order by " + sortfield + " " + sortDescOrasc + ") as rownum, id, name, sex, createtime from Tb_person) as a where a.rownum > " + (pageIndex - 1) * pagenumber + " and a.rownum <= " + pageIndex * pagenumber + "";
                //获取数据
                dt = SQLHelper.ExecuteTable(pageIndexNotOne, CommandType.Text);
            }
            else { }


            //将datatable转换为json
            //在返回的JSON数据中，加入total属性（总记录数）
            //那么他就会在加载的时候，显示总记录数。
            //显示的格式是【 {"total":12, "rows":"[{},{},{}]"} 】,rows内为JSON数据。
            string strjson = "{\"total\":15, \"rows\":" + DatatableToJson.ToJson(dt) + "}";

            context.Response.Write(strjson);
        }