jqGrid只允许1个排序方向

Question

列标题上的jqGrid排序图标显示向上和向下箭头。有没有办法强制图标只显示1个方向，只允许升序？

感谢。

Answer 1

在the answer中，我展示了如何更改排序图标的可见性。我为您修改了之前的解决方案，仅显示活动排序图标。

The demo演示结果并显示如下标题：

或者这个：

下面的代码显示了代码中最重要的部分：

var $grid = $("#list");

$grid.jqGrid({
    //... other jqGrid options
    sortname: 'invdate',
    sortorder: 'desc',
    onSortCol: function (index, idxcol, sortorder) {
        var $icons = $(this.grid.headers[idxcol].el).find(">div.ui-jqgrid-sortable>span.s-ico");
        if (this.p.sortorder === 'asc') {
            //$icons.find('>span.ui-icon-asc').show();
            $icons.find('>span.ui-icon-asc')[0].style.display = "";
            $icons.find('>span.ui-icon-desc').hide();
        } else {
            //$icons.find('>span.ui-icon-desc').show();
            $icons.find('>span.ui-icon-desc')[0].style.display = "";
            $icons.find('>span.ui-icon-asc').hide();
        }
    }
});
// hide initially the disaabled sorting icon
$('#jqgh_' + $.jgrid.jqID($grid[0].id) + '_' + $.jgrid.jqID(sortName) + '>span.s-ico').each(function () {
    $(this).find('>span.ui-icon-' +
        (sortDirection ? 'asc' : 'desc')).hide();
});

我在开始时尝试在$icons.find('>span.ui-icon-asc').show();中使用onSortCol，但在Google Chrome中遇到问题，因为show（）在display: block元素上设置了<span>样式。所以我刚刚删除了display: none样式。

Answer 2

查看jqGrid事件文档here。您可以在'stop'事件上返回onSortCol来定义自己的排序。这样的事情应该有效：

onSortCol: function (index, iCol, sortorder) {
    if (sortorder === "desc") {
            return 'stop';
    } else {
            //do regular sorting.
    }
}

此外，如果你在gridComplete上执行此操作，它应该隐藏降序箭头：

gridComplete: function () {
    $('.ui-grid-ico-sort.ui-icon-desc.ui-sort-ltr').hide();
}