ASP.NET DataGrid 自訂分頁實作：首頁/上下頁/末頁/頁碼跳轉完整範例

停用 DataGrid 內建分頁 UI，自行實作 LinkButton 導航列（首頁、上頁、下頁、末頁、頁碼輸入跳轉），配合 CurrentPageIndex 與 PageIndexChanged 事件實現完整分頁控制。

ASPX 頁面結構

<asp:DataGrid ID="MyDataGrid" runat="server" AllowPaging="True" PageSize="20"
    AutoGenerateColumns="False" DataKeyField="FDictID"
    OnPageIndexChanged="MyDataGrid_PageIndexChanged">
  <Columns>...</Columns>
  <PagerStyle Visible="False" />  <!-- 隱藏內建分頁 -->
</asp:DataGrid>

<!-- 自訂導航列 -->
<asp:LinkButton ID="btnFirst" CommandArgument="first" OnClick="PagerButtonClick" runat="server">首頁</asp:LinkButton>
<asp:LinkButton ID="btnPrev" CommandArgument="prev" OnClick="PagerButtonClick" runat="server">上一頁</asp:LinkButton>
<asp:LinkButton ID="btnNext" CommandArgument="next" OnClick="PagerButtonClick" runat="server">下一頁</asp:LinkButton>
<asp:LinkButton ID="btnLast" CommandArgument="last" OnClick="PagerButtonClick" runat="server">末頁</asp:LinkButton>
<asp:Label ID="lblCurrentIndex" runat="server" /> / <asp:Label ID="lblPageCount" runat="server" />
<asp:TextBox ID="txtGoPage" runat="server" Width="30px" />
<asp:Button ID="btnGo" Text="GO" OnClick="btnGo_Click" runat="server" />

後端核心邏輯

private void BindGrid()
{
    string sql = "SELECT * FROM t_dict";
    SqlDataAdapter da = new SqlDataAdapter(sql, connStr);
    DataSet ds = new DataSet();
    da.Fill(ds, "t_dict");
    MyDataGrid.DataSource = ds.Tables["t_dict"].DefaultView;
    MyDataGrid.DataBind();
    ShowStatsPage();
}

void ShowStatsPage()
{
    lblCurrentIndex.Text = $"[目前第：{MyDataGrid.CurrentPageIndex + 1}頁]";
    lblPageCount.Text = $"[共：{MyDataGrid.PageCount}頁]";
}

void PagerButtonClick(object sender, EventArgs e)
{
    string arg = ((LinkButton)sender).CommandArgument;
    switch (arg)
    {
        case "next": if (MyDataGrid.CurrentPageIndex < MyDataGrid.PageCount - 1) MyDataGrid.CurrentPageIndex++; break;
        case "prev": if (MyDataGrid.CurrentPageIndex > 0) MyDataGrid.CurrentPageIndex--; break;
        case "first": MyDataGrid.CurrentPageIndex = 0; break;
        case "last": MyDataGrid.CurrentPageIndex = MyDataGrid.PageCount - 1; break;
    }
    BindGrid();
}

void MyDataGrid_PageIndexChanged(object source, DataGridPageChangedEventArgs e)
{
    MyDataGrid.CurrentPageIndex = e.NewPageIndex;
    BindGrid();
}

void btnGo_Click(object sender, EventArgs e)
{
    if (int.TryParse(txtGoPage.Text.Trim(), out int page) && page >= 1 && page <= MyDataGrid.PageCount)
    {
        MyDataGrid.CurrentPageIndex = page - 1;
        BindGrid();
    }
}

關鍵點總結

• PagerStyle Visible="False" 隱藏內建分頁，避免雙重 UI
• CommandArgument 識別導航動作，單一事件處理多按鈕
• PageIndexChanged 處理內建頁碼點擊（若保留數字分頁）
• TryParse 防禦非數字輸入，邊界檢查防越界
• 每次分頁動作結束呼叫 BindGrid() 重新繫結

現代替代：GridView + DataPager

ASP.NET 3.5+ 建議使用 ListView + DataPager 或 GridView 內建 PagerTemplate 客製化分頁 UI，無需手寫導航邏輯。