JqGrid 列的 ignoreCase 排序不生效如何解决

2026-10-24支付老李

结论

ignoreCase 是 jqGrid 的全局配置项，不能放在 colModel 的单列配置中。应将它写在 jqGrid 初始化参数的顶层，同时为需要排序的文本列设置 sorttype: "text"：

$("#list").jqGrid({
    ignoreCase: true,
    colModel: [
        {
            name: "name",
            editable: true,
            width: 120,
            sorttype: "text",
            sortable: true
        }
    ]
});

这样，jqGrid 在本地进行文本排序时会忽略字母大小写。

原因

原配置把 ignoreCase 写在了列定义中：

{name: 'name', sorttype: 'text', ignoreCase: true}

jqGrid 不会从单个 colModel 项中读取这个参数，所以配置不会生效。原配置中的 soratble 也有拼写错误，正确写法是 sortable。

问题中期望的顺序：

Trouble Ticket
product Sales Agent
email Queue
default Queue
Billing & Payment

这是忽略大小写后的降序结果。设置 ignoreCase: true 后，还要点击列标题，将排序方向切换为降序。

完整配置示例

$("#list").jqGrid({
    colNames: [
        "questionId",
        "Name",
        "Answer",
        "Show",
        "Edit",
        "Option"
    ],

    colModel: [
        {
            name: "questionId",
            sorttype: "int",
            align: "left",
            editable: true,
            hidden: true
        },
        {
            name: "name",
            editable: true,
            width: 120,
            sorttype: "text",
            sortable: true
        },
        {
            name: "answer",
            align: "left",
            width: 400,
            sorttype: "text",
            editable: true
        },
        {
            name: "enable",
            align: "center",
            width: 60,
            sorttype: "text",
            editable: true,
            formatter: formatEnable
        },
        {
            name: "edit",
            editable: false,
            formatter: addEditButton,
            align: "center",
            width: 50
        },
        {
            name: "feedbackOptions.optionId",
            editable: false,
            align: "center",
            hidden: true
        }
    ],

    // 必须放在 jqGrid 的顶层配置中
    ignoreCase: true,

    jsonReader: {
        root: "rows",
        page: "page",
        total: "total",
        records: "records",
        repeatitems: false
    },

    multiselect: true,
    height: "170px",
    emptyrecords: " ",
    viewrecords: true,
    rowNum: 10,
    rowList: [10, 20, 30],
    pager: "#pager",
    loadonce: true,
    footerrow: false,
    userDataOnFooter: true,
    altRows: true,

    loadComplete: function () {
        $("#buttonDiv").show();
    }
});

$("#list").jqGrid("navGrid", "#pager", {
    del: false,
    add: false,
    edit: false,
    search: false,
    refresh: false
});

注意事项

ignoreCase 主要用于 jqGrid 的本地排序。当前配置使用了 loadonce: true，数据首次加载后会转为本地处理，因此后续排序可以应用该设置。

如果未使用 loadonce: true，或者启用了服务端排序，jqGrid 只会把排序字段和方向发送给后端。是否忽略大小写由数据库或服务端代码决定。此时需要在后端采用不区分大小写的排序方式，例如根据数据库类型设置大小写不敏感的 collation，或者按 LOWER(name) 排序。

另外需要注意：

文本列应使用 sorttype: "text"。
sortable 的默认值通常是 true，可以省略，但不能误写为 soratble。
ignoreCase 是表格级选项，会影响所有本地文本排序，而不只是 name 列。
原配置中的 loadonce 出现了两次，保留一处即可。