使用jQuery导出JQGrid全量数据至Excel的GetData方法实现求助

导出文件为空核心是两个问题：

• GetData方法直接返回JSON字符串，GridView无法识别字符串作为数据源完成字段绑定，无法生成表格内容
• 前端AJAX请求未指定二进制响应类型，拿到的文本数据生成Blob后存在编码损坏，导致文件内容异常

1. 后端代码修正 #

原有逻辑中先把查询结果序列化为JSON、再传给GetData的操作属于多余流程，直接绑定查询到的集合数据即可。如果需要保留GetData处理JSON的逻辑，需要将JSON反序列化为GridView可识别的集合类型，不能直接返回字符串。
注意：原代码使用ASCII编码会导致中文/特殊字符乱码，需替换为UTF8编码

完整修正后后端代码 #

using Newtonsoft.Json;
using System.Collections.Generic;

// 替换为你项目中实际的产品分类映射实体类，字段和数据库查询返回字段对齐
public class ProductCategaryMapping
{
    public int Id { get; set; }
    public string CategoryName { get; set; }
    public string ProductCode { get; set; }
    // 其余业务字段按实际情况补充
}

public ActionResult ExportToExcel()
{
    var pcmData = object_ProductCategaryMapping.ProductCategaryMappingGet();
    
    var grdReport = new System.Web.UI.WebControls.GridView();
    // 直接绑定查询到的全量集合即可，无需多余JSON转换
    grdReport.DataSource = pcmData;
    grdReport.DataBind();

    System.IO.StringWriter sw = new System.IO.StringWriter();
    System.Web.UI.HtmlTextWriter htw = new System.Web.UI.HtmlTextWriter(sw);
    grdReport.RenderControl(htw);
    
    // 替换为UTF8编码解决乱码问题
    byte[] bindata = System.Text.Encoding.UTF8.GetBytes(sw.ToString());
    return File(bindata, "application/ms-excel", "ss.xls");
}

// 若需保留GetData处理JSON的逻辑，按如下写法，返回值改为可绑定的集合类型
public List<ProductCategaryMapping> GetData(string jsonData)
{
    // 将JSON字符串反序列化为实体集合，GridView可自动识别字段生成表格列
    return JsonConvert.DeserializeObject<List<ProductCategaryMapping>>(jsonData);
}

如果不想手动定义实体类，可直接反序列化为动态字典集合，适配任意表结构：

public List<Dictionary<string, object>> GetData(string jsonData)
{
    return JsonConvert.DeserializeObject<List<Dictionary<string, object>>>(jsonData);
}

2. 前端下载逻辑修正 #

两种改法任选其一即可：

方案1：修正AJAX请求参数 #

原有AJAX未指定二进制响应类型，会导致拿到的文件数据编码错误，需补充xhrFields配置：

$('#download').click(function (e) {
    $.ajax({
        type: 'GET',
        url: '/PCM/ExportToExcel',
        // 指定响应类型为二进制Blob，避免数据编码损坏
        xhrFields: {
            responseType: 'blob'
        },
        success: function (response) {
            var blob = new Blob([response], { type: 'application/vnd.ms-excel' })
            var downloadUrl = URL.createObjectURL(blob);
            var a = document.createElement("a")
            a.href = downloadUrl;
            a.download = "ss.xls"
            document.body.appendChild(a)
            a.click()
            // 释放内存，移除临时节点
            URL.revokeObjectURL(downloadUrl);
            document.body.removeChild(a);
        }
    })
})

方案2：直接跳转（最简实现） #

导出接口为GET请求时，不需要写AJAX逻辑，直接触发页面跳转即可触发浏览器下载，代码量更少且不会出现编码问题：

$('#download').click(function (e) {
    window.location.href = '/PCM/ExportToExcel';
})

更优实现建议 #

当前通过GridView渲染HTML改后缀为.xls的方式属于伪Excel格式，用户打开文件时会弹出格式兼容提示，长期使用建议选择以下方案：

• 服务端导出：使用NPOI、EPPlus（非商用场景选择4.x免费版本）等专门的Excel处理库生成标准格式的Excel文件，不依赖WebForm控件，性能更好，无兼容弹窗
• 前端导出：如果只需要导出JQGrid当前已加载的全量数据，可直接在前端读取JQGrid数据，使用SheetJS等前端表格库生成Excel文件触发下载，不需要请求后端，降低服务端压力

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