jqGrid多选列过滤器：如何将多值以数组格式而非逗号分隔发送？

核心思路 #

问题根源在于多选过滤器默认用逗号拼接选项，但选项本身包含逗号导致后端无法拆分。我们需要两步处理：先修改多选选项的分隔符避开逗号，再通过jqGrid的参数序列化回调修改最终请求格式。

方案1：生成重复Key的请求参数（?keyB=fname1, gname1&keyB=fname2, gname2） #

通过serializeGridData回调拆分选项并生成重复Key：

$("#yourGridId").jqGrid({
    // 其他网格配置
    colModel: [
        // 其他列配置
        {
            name: "keyB",
            searchoptions: {
                multiple: true,
                // 把默认逗号分隔符改成非冲突字符，比如竖线
                delimiter: "|",
                // 你的其他搜索配置（如dataUrl等）
            }
        }
    ],
    serializeGridData: function(postData) {
        const processedData = {};
        $.each(postData, (key, value) => {
            if (key === "keyB" && typeof value === "string") {
                // 用自定义分隔符拆分选项
                const options = value.split("|");
                // 生成重复Key的数组格式
                processedData[key] = options;
            } else {
                processedData[key] = value;
            }
        });
        // 第二个参数true会将数组转为重复Key格式
        return $.param(processedData, true);
    }
});

方案2：生成JSON数组格式参数（?keyB=["familyName1, givenName1", "famylyName2, givenName2"]） #

同样修改分隔符后，将选项序列化为JSON字符串：

$("#yourGridId").jqGrid({
    colModel: [
        {
            name: "keyB",
            searchoptions: {
                multiple: true,
                delimiter: "|",
            }
        }
    ],
    serializeGridData: function(postData) {
        if (postData.keyB && typeof postData.keyB === "string") {
            const options = postData.keyB.split("|");
            // 将选项转为JSON数组字符串
            postData.keyB = JSON.stringify(options);
        }
        return $.param(postData);
    }
});

后端接收到参数后直接解析JSON即可得到完整选项数组。

方案3：生成带引号包裹的参数（?keyB="familyName1, givenName1", "famylyName2, givenName2"） #

适合后端支持直接解析带引号的逗号分隔字符串：

$("#yourGridId").jqGrid({
    colModel: [
        {
            name: "keyB",
            searchoptions: {
                multiple: true,
                delimiter: "|",
            }
        }
    ],
    serializeGridData: function(postData) {
        if (postData.keyB && typeof postData.keyB === "string") {
            const options = postData.keyB.split("|");
            // 给每个选项加引号后用逗号拼接
            postData.keyB = options.map(opt => `"${opt}"`).join(",");
        }
        return $.param(postData);
    }
});

关键注意事项 #

• 必须修改searchoptions.delimiter为非逗号字符，否则无法区分选项内部逗号和选项之间的分隔符，这是所有方案的前提。
• serializeGridData是jqGrid专门用来修改请求参数的回调，所有参数格式调整都在这里完成。

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