eayui datagrid 分页 排序 详解

  最近因为经常使用easyui 在做表格时难免后出现排序 及分页的问题，但是 在官网中没有 相关的介绍及例子，所以经过多方面的查找后，终于完成了分页 和排序的功能

 

首先 页面datagrid 要排序的必要的条件是 2个 sortable：true，remoteSort: false，见标红处

 function JTContent(titile) {            $("#Info").datagrid({                title: titile + "--二级公司",                loadMsg: "正在加载数据，请等待！",                singleSelect: true,                rownumbers: true,                remoteSort: false, //必要条件1                autoRowHeight: false,                pagination: true,                queryParams: { "name": "Tload" },                striped: true,                align: 'center',                url: "CouInfo.aspx",                columns: [[                 { field: 'T_COMDESC', title: '单位名称', sortable: true, align: 'center' },                  { field: '电厂地址', title: '地理位置', align: 'center', sortable: true },                  { field: '所属省份', title: '所属省份', align: 'center', sortable: true },                  { field: '火电装机容量', title: '火电装机容量(兆瓦)', align: 'center', sortable: true },                 { field: '脱硫装置类型装机容量', title: '脱硫装机容量(兆瓦)', align: 'center', sortable: true },                 { title: '脱硝装机容量(兆瓦)', field: '脱硝装置类型装机容量', align: 'center', sortable: true },                   { title: '火电厂个数', field: '电厂个数', align: 'center', sortable: true },                  { title: '火电机组数量(台)', field: '火电机组数量', align: 'center', sortable: true },                 { title: '脱硫机组数量(台)', field: '脱硫装置类型机组', align: 'center', sortable: true },                  { title: '脱硝机组数量(台)', field: '脱硝装置类型机组', align: 'center', sortable: true },                  { title: '脱硫装置套数(套)', field: '脱硫装置套数', align: 'center', sortable: true },                    { title: '脱硝装置套数(套)', field: '脱硝装置类型机组', align: 'center', sortable: true },                   { title: '二级单位接入情况', field: '二级单位接入情况', align: 'center', sortable: true }                            ]]            }, 'json');        }

然后就是 easyui每次访问后台数据时都会默认传送两个参数 rows，page

 

rows ---每页显示多少条数据 ，page--- 第几页

 

这样大家就知道怎么处理了吧，为了方便大家我封装了一个dll 大家在页面引用下就可以用了

 

使用用方式  Common_CFJ.Common_CFJ.datagridData(data);

下载地址   http://files.cnblogs.com/DDSkay/Common_CFJ.zip

文件下载