ASP.NET 跨分頁多選實現：HiddenField 保存選中鍵值、DataBind 時回填勾選狀態

DataGrid 分頁時預設不保留跨頁勾選。解法：**客戶端 HiddenField 累積選中鍵值 → 伺服器端 DataBind 時讀取 HiddenField 並回填 CheckBox.Checked**。本文提供完整 ASPX + CodeBehind 範例。

核心思路

1. 頁面放置 <input type="hidden" id="HdnSelectedValues" runat="server" /> 存儲逗號分隔鍵值 (如 ,Title1,Title2)。
2. CheckBox onclick 呼叫 JS 函數增刪 HiddenField 值。
3. ItemDataBound 事件中檢查當前行鍵值是否在 HiddenField 中，若是設定 Checked = true。

ASPX 關鍵片段

<script>
function AddRemoveValues(chk) {
    var hdn = document.getElementById('<%= HdnSelectedValues.ClientID %>');
    if (chk.checked) hdn.value += ',' + chk.value;
    else hdn.value = hdn.value.replace(',' + chk.value, '');
}
</script>

<asp:DataGrid ID="DataGrid1" runat="server" AutoGenerateColumns="False" AllowPaging="True" OnItemDataBound="DataGrid1_ItemDataBound">
  <Columns>
    <asp:TemplateColumn HeaderText="選擇">
      <ItemTemplate>
        <input type="checkbox" runat="server" id="chkSelect" onclick="AddRemoveValues(this)"
               value='<%# Eval("Title") %>' />
      </ItemTemplate>
    </asp:TemplateColumn>
    <asp:BoundColumn DataField="Title" HeaderText="文章標題" />
    <asp:BoundColumn DataField="CreateDate" HeaderText="發布時間" />
  </Columns>
</asp:DataGrid>

<asp:Button ID="Button1" runat="server" Text="取得選中值" OnClick="Button1_Click" />
<asp:Label ID="Label1" runat="server" />
<input type="hidden" id="HdnSelectedValues" runat="server" />

CodeBehind 關鍵邏輯

private void DataGrid1_ItemDataBound(object sender, DataGridItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        string title = ((Literal)e.Item.FindControl("TitleShow")).Text; // 或 DataBinder.Eval
        if (HdnSelectedValues.Value.IndexOf("," + title) >= 0)
        {
            ((HtmlInputCheckBox)e.Item.FindControl("chkSelect")).Checked = true;
        }
    }
}

protected void Button1_Click(object sender, EventArgs e)
{
    // 解析 HiddenField 值
    var selected = HdnSelectedValues.Value.TrimStart(',').Split(',');
    Label1.Text = string.Join("
", selected);
}

改進建議

• 鍵值使用**唯一識別碼 (ID/GUID)** 而非標題，避免重複/特殊字元問題。
• JS 使用 Set 或陣列管理，避免字串替換效能與邊界問題。
• 現代專案改用 **GridView + CheckBoxField + ViewState/Session 保存選中集合**，或前端 JS 管理狀態再一次性提交。
• 大量資料考慮「全選/反選」功能與虛擬滾動。