jqGrid在客戶端排序

Question

我有一個帶有自動加載行的樹形網格。 目標是在客戶端右側按樹列對網格進行排序。

但每次我點擊排序列標題時，它都會發出一個Ajax調用進行排序，但我只需要使用本地數據進行就地排序。

我是否有不正確的網格參數或樹樹上的客戶端排序沒有樹？

用於排序的當前jqGrid參數是：

loadonce: true, // to enable sorting on client side
sortable: true //to enable sorting

Answer 1

要使客戶端排序正常工作，我需要在加載網格后調用reloadGrid ：

loadComplete: function() {
    jQuery("#myGridID").trigger("reloadGrid"); // Call to fix client-side sorting
}

我沒有必要在我的應用程序中的另一個網格上執行此操作，因為它被配置為使用通過另一個AJAX調用檢索的數據，而不是由網格直接檢索的數據：

editurl: "clientArray"
datatype: "local"

Answer 2

我在jqGrid上使用客戶端排序，並在選擇列表更改時檢索一組新的json數據。 您需要將rowTotal設置為高於或等於返回的行數，然后在重新加載網格之前將數據類型設置為“json”。

// Select list value changed
$('#alertType').change(function () {
        var val = $('#alertType').val();
        var newurl = '/Data/GetGridData/' + val;
        $("#list").jqGrid().setGridParam({ url: newurl, datatype: 'json' }).trigger("reloadGrid");        
});

// jqGrid setup
$(function () {
        $("#list").jqGrid({
            url: '/Data/GetGridData/-1',
            datatype: 'json',
            rowTotal: 2000,
            autowidth: true,
            height:'500px',
            mtype: 'GET',
            loadonce: true,
            sortable:true,
            ...
            viewrecords: true,
            caption: 'Overview',
            jsonReader : { 
                root: "rows", 
                total: "total", 
                repeatitems: false, 
                id: "0"
            },
            loadtext: "Loading data...",
        });
    }); 

Answer 3

$(function () {
        $("#list").jqGrid({
            url: '/Data/GetGridData/-1',
            datatype: 'json',
            rowTotal: 2000,
            autowidth: true,
            height:'500px',
            mtype: 'GET',
            loadonce: true,
            sortable:true,
            ...
            viewrecords: true,
            caption: 'Overview',
            jsonReader : { 
                root: "rows", 
                total: "total", 
                repeatitems: false, 
                id: "0"
            },
            loadtext: "Loading data...",
        });
    });