Guriddo jqGrid多选过滤器含逗号数据过滤问题

问题背景 #

需在Guriddo jqGrid中使用多选过滤器，但部分字段数据包含逗号，因此需要将多选筛选的分隔符改为';'，键值分隔符改为':'。该功能在Free jqGrid中可通过inFilterSeparator配置实现，但Guriddo jqGrid v5.8.5无此配置项，需自定义处理。

解决方案 #

1. 单列自定义筛选规则 #

针对需要特殊处理的列，在colModel中配置自定义筛选逻辑，解析以';'分隔的选中值，同时处理':'分隔的键值对：

colModel: [
    // 其他列配置...
    {
        name: "targetField",
        label: "目标字段",
        width: 200,
        filtertype: "custom",
        filteroptions: {
            customSearch: function (filterValue) {
                // 按';'拆分筛选值，解析':'分隔的键值对，提取实际匹配值
                var matchValues = filterValue.split(';').map(item => {
                    let parts = item.split(':');
                    return parts.length > 1 ? parts[1].trim() : item.trim();
                }).filter(val => val);

                // 构造OR逻辑的筛选规则
                return {
                    groupOp: "OR",
                    rules: matchValues.map(val => ({ op: "eq", data: val }))
                };
            },
            customFcn: function (elem) {
                // 初始化多选控件，配置分隔符为';'
                $(elem).multiselect({
                    separator: ';',
                    nonSelectedText: '请选择',
                    onChange: () => $(elem).trigger('change')
                });
            }
        }
    }
    // 其他列配置...
]

2. 全局重写筛选分隔符 #

如果需要所有多选筛选都生效，可重写Guriddo jqGrid的parseInFilter方法，替换默认逗号分隔符为';'：

// 重写全局解析多选筛选值的方法
$.jgrid.parseInFilter = function (filterStr) {
    if (!filterStr) return [];
    return filterStr.split(';').map(item => {
        let parts = item.split(':');
        return parts.length > 1 ? parts[1].trim() : item.trim();
    }).filter(val => val);
};

注意事项 #

• 若使用第三方多选插件（如select2），需同步将插件的选中值分隔符配置为';'，避免和字段内的逗号冲突。
• 若采用远程筛选，需确保后端服务能识别';'分隔的筛选值，对应调整后端逻辑。

内容的提问来源于stack exchange，提问作者Dhirendra Medsing