最近因為經常使用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: '單位名稱'<spanstyle="color:#ff0000sortable: 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);