如何在导出GridView至Excel时排除前端JS隐藏的行？

问题核心是：客户端JS隐藏的行不会同步到后台ViewState，后台导出时仍基于原始数据源生成Excel，所以会包含所有行。以下是两种实用解决方案：

方案1：后台复现客户端筛选逻辑（推荐，稳定性高） #

如果你的筛选逻辑简单（比如单文本框模糊匹配某列），直接把筛选值传到后台，重新过滤数据源后再导出，完全避开客户端状态同步问题。

步骤： #

1. 页面添加隐藏域存储筛选值

<asp:HiddenField ID="hfFilterValue" runat="server" />
<asp:TextBox ID="txtFilter" runat="server" onkeyup="filterGridView()"></asp:TextBox>

2. 修改JS筛选函数，同步筛选值到隐藏域

function filterGridView() {
    const filterText = document.getElementById('<%= txtFilter.ClientID %>').value.trim();
    const gridRows = document.querySelectorAll('#<%= GridView1.ClientID %> tr:not(:first-child)');
    
    // 客户端筛选逻辑（原逻辑保留）
    gridRows.forEach(row => {
        // 假设匹配第二列（索引1）的内容，根据实际列调整
        const cellText = row.cells[1].textContent || row.cells[1].innerText;
        row.style.display = cellText.includes(filterText) ? '' : 'none';
    });
    
    // 同步筛选值到隐藏域
    document.getElementById('<%= hfFilterValue.ClientID %>').value = filterText;
}

3. 后台导出方法中重新过滤数据源

protected void btnExport_Click(object sender, EventArgs e)
{
    // 获取原始数据源（比如从Session或数据库重新获取）
    DataTable originalDt = GetOriginalDataSource();
    string filterText = hfFilterValue.Value.Trim();

    // 后台复现筛选逻辑
    if (!string.IsNullOrEmpty(filterText))
    {
        originalDt = originalDt.AsEnumerable()
            .Where(row => row["目标列名"].ToString().Contains(filterText))
            .CopyToDataTable();
    }

    // 绑定过滤后的数据源并导出
    GridView1.DataSource = originalDt;
    GridView1.DataBind();
    
    // 执行原有导出逻辑
    Response.Clear();
    Response.Buffer = true;
    Response.ContentType = "application/vnd.ms-excel";
    Response.AddHeader("content-disposition", "attachment;filename=导出数据.xls");
    Response.Charset = "";
    this.EnableViewState = false;
    using (StringWriter sw = new StringWriter())
    using (HtmlTextWriter hw = new HtmlTextWriter(sw))
    {
        GridView1.RenderControl(hw);
        Response.Write(sw.ToString());
        Response.End();
    }
}

方案2：JS收集显示行ID，后台过滤数据源 #

适合复杂客户端筛选（比如多列组合、自定义匹配规则），无法在后台简单复现的场景。

步骤： #

1. 页面添加隐藏域存储显示行的主键ID

<asp:HiddenField ID="hfVisibleRowIDs" runat="server" />

2. 修改JS筛选函数，收集显示行的主键ID

function filterGridView() {
    const filterText = document.getElementById('<%= txtFilter.ClientID %>').value.trim();
    const gridRows = document.querySelectorAll('#<%= GridView1.ClientID %> tr:not(:first-child)');
    const visibleIDs = [];

    gridRows.forEach(row => {
        // 假设主键在第一列（索引0），根据实际列调整
        const rowID = row.cells[0].textContent || row.cells[0].innerText;
        // 客户端筛选逻辑
        const cellText = row.cells[1].textContent || row.cells[1].innerText;
        const isVisible = cellText.includes(filterText);
        
        row.style.display = isVisible ? '' : 'none';
        if (isVisible) visibleIDs.push(rowID);
    });

    // 将显示行ID用逗号分隔存入隐藏域
    document.getElementById('<%= hfVisibleRowIDs.ClientID %>').value = visibleIDs.join(',');
}

3. 后台导出时根据ID列表过滤数据源

protected void btnExport_Click(object sender, EventArgs e)
{
    DataTable originalDt = GetOriginalDataSource();
    string visibleIDs = hfVisibleRowIDs.Value;

    if (!string.IsNullOrEmpty(visibleIDs))
    {
        string[] idArray = visibleIDs.Split(',');
        // 过滤出包含在显示ID列表中的行
        originalDt = originalDt.AsEnumerable()
            .Where(row => idArray.Contains(row["主键列名"].ToString()))
            .CopyToDataTable();
    }

    // 绑定并导出（同方案1的导出逻辑）
    GridView1.DataSource = originalDt;
    GridView1.DataBind();
    // ... 导出代码
}

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