EasyUI Datagrid 分頁的情況下實現點擊表頭的小三角圖標對數據庫中所有數據重新排序

說明一下：
當點擊 datagrid 表頭某一列的小三角圖標時，easyui 本身是有排序的，但是在當我們對 datagrid 進行了分頁的情況下，點擊排序只是對當前頁的數據進行排序，而需求需要我對數據庫裏面的所有數據進行排序，這樣的話只能從後臺先排好序再返回了。

看了一下文檔，發現點擊小三角圖標時會觸發 onSortColumn 事件，於是我們只要在觸發這個事件的時候重新向後臺請求一遍 datagrid 的數據好了。

那就直接上代碼吧~~

var sortOrder = "asc"; // 排序方式，asc：正序，desc：倒序
var sortField = "NickName"; // 要排序的列名稱

// 初始化數據列表
function initDatagrid() {
    $('#dg').datagrid({
        url: '/api/Member',
        method: "get",
        striped: true,
        border: true,
        selectOnCheck: false,
        checkOnSelect: false,
        remoteSort: true, // 定義是否從服務器排序數據，要設置爲true
        singleSelect: false,
        idField: 'MemberId',
        pagination: true,
        rownumbers: false,
        pageSize: 20,
        fitColumns: true,
        columns: [[                
                ...
        ]],
        // 把要排序的列名稱與正序/倒序這兩個參數也傳到後臺進行處理
        onBeforeLoad: function (params) {
            params.nickName = $("#nickName").val();
            params.phone = $('#phone').val();
            params.sortField = sortField;
            params.sortOrder = sortOrder;
        },
        // 點擊某一列進行排序時觸發的事件
        onSortColumn: function (sort, order) {
            sortField = sort;  // 要排序的列名稱
            sortOrder = order;  // 正序or倒序

            $('#dg').datagrid('reload');
        }
    });
}

不過這樣還沒完善，在 easyui 裏本來點擊 onSortColumn 就是請求了一次後臺的，這一點可以打斷點測試一下。
所以，我們需要把原來的那次請求屏蔽掉，否則會請求兩次後臺。
具體的做法，就是修改 jquery.easyui.js / jquery.easyui.min.js 文件。

在 jquery.easyui.js / jquery.easyui.min.js 文件中搜 remoteSort，找到下面這段代碼

if(opts.remoteSort){
_646(_63c);
}else{
_647(_63c,$(_63c).datagrid("getData"));
}
opts.onSortColumn.call(_63c,opts.sortName,opts.sortOrder);
};

把 if 裏面執行的代碼註釋掉就好了。（在上圖中是 _646(_63c);，有可能不一樣？？）。
PS：datagrid 和 treegrid 都有 remoteSort 這個東東，別搞錯了！！

End.