如何对jqgrid列进行排序？

Question

列不排序。

我尝试将数据类型更改为local并添加loadonce: true。列设置为sortable: true，我尝试将sorttype设置为string和text，但都不起作用。我使用的是JQGrid版本4.5.2。

var grid = jQuery("#AgencyQuotesGrid");
grid.jqGrid({
    url: '/Admin/QuotesGrid',
    altRows: true,
    altclass: 'myAltRowClass',
    autowidth: false,
    datatype: 'local',
    mtype: 'POST',
    colNames: ['Agency', 'Agency Name', 'Quote Number', 'Insured Name', 'Product', 'Status', 'Effective Date', 'Last Update'],
    colModel: [
        { name: 'AgencyCode', index: 'AgencyCode', width: 6, align: 'left', sortable: true, sorttype: 'string', stype: 'text', classes: 'defaultpointer' },
        { name: 'AgencyName', index: 'AgencyName', width: 11, align: 'left', sortable: true, classes: 'defaultpointer' },
        { name: 'QuoteCode', index: 'QuoteCode', width: 6, align: 'left', sortable: true, classes: 'defaultpointer' },
        { name: 'InsuredName', index: 'InsuredName', width: 11, align: 'left', sortable: true, classes: 'defaultpointer' },
        { name: 'PackageTypeCode', index: 'PackageTypeCode', width: 7, align: 'left', sortable: true, classes: 'defaultpointer' },
        { name: 'Status', index: 'Status', width: 3, align: 'left', formatter: changeToolTip, classes: 'defaultpointer' },
        { name: 'EffectiveDate', index: 'EffectiveDate', width: 7, align: 'left', classes: 'defaultpointer' },
        { name: 'UpadateDate', index: 'UpadateDate', width: 7, align: 'left', classes: 'defaultpointer'}],
    height: '100%',
    rowNum: 20,
    rowList: [20, 20, 50],
    sortname: "EffectiveDate",
    sortorder: "desc",
    viewrecords: true,
    imgpath: "../../Content/Images/",
    caption: '',
    loadonce: true,
    pager: "#AgencyQuotesPager",
    emptyrecords: "No quotes have been submitted",
    onSelectRow: function (ids) {
        $.cookie('lasttab', $('#subTabs').tabs('option', 'selected'), { expires: 1 });
        if (ids != null) {
            var data = $("#AgencyQuotesGrid").getRowData(ids);
            $("#AgencyQuotesGrid").trigger(window.location.href = '/Admin/QuoteRouter/?id=' + data.AgencyCode + '&code=' + data.QuoteCode + '&type=' + encodeURIComponent(data.PackageType))
        }
    },
    loadComplete: function () { $("#AgencyQuotesGrid").setGridWidth($('#AgencyQuotesContainer').width() - 40, true), $('.ui-jqgrid').css('font-size', 14); jQuery("#AgencyQuotesGrid").trigger("reloadGrid"); },
    onSortCol: function (index, columnIndex, sortOrder) {
        var col = $("#grid_summarygrid").getGridParam('colNames');
        var label = "Ordered by " + col[columnIndex] + " " + sortOrder + "ending";

        $("#gridsort").text(label);
    }
}).navGrid($('#AgencyQuotesPager'), { edit: false, add: false, del: false, search: true });
});

我希望列可以排序，但事实并非如此。列箭头发生变化，网格弹出“正在加载...”但一切都没有改变。我很感谢你的帮助。

Answer 1

每次网格加载时都会触发loadComplete，这包括本地加载、排序、分页等。您注册了一个事件处理程序，该事件处理程序随后会立即重新加载网格(通过调用trigger("reloadGrid"))，这会导致网格清除自身并恢复到初始状态。删除reloadGrid触发器，它应该遵守客户端排序。

loadComplete: function () {
    [...]
    jQuery("#AgencyQuotesGrid").trigger("reloadGrid");
}