ASP.NET 2.0 GridView 進階分頁與排序技巧

GridView 控制項中的「選取」操作純粹是 UI 概念，其 SelectedIndex 屬性對應表格可視資料列中目前被選取列的索引。若啟用表格分頁與排序功能，執行分頁或排序操作後，SelectedIndex 值不變，因此執行這些操作後，會選取到新資料列。某些情境下，保留對指定資料列的選取較好，即使該列在表格目前頁面中不可見。下列範例示範如何在排序與分頁操作後仍保留目前選取的資料列。

Sub GridView1_DataBound(ByVal sender As Object, ByVal e As System.EventArgs)
Dim Row As GridViewRow
Dim SelectedValue As String = ViewState("SelectedValue")
If SelectedValue Is Nothing Then
Return
End If
' 偵測選取的列是哪個並重新選取它
For Each Row In GridView1.Rows
Dim KeyValue As String = GridView1.DataKeys(Row.RowIndex).Value
If (KeyValue = SelectedValue) Then
GridView1.SelectedIndex = Row.RowIndex
End If
Next
End Sub
Protected Sub GridView1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)
' 儲存選取列的索引
If (Not GridView1.SelectedIndex = -1) Then
ViewState("SelectedValue") = GridView1.SelectedValue
End If
End Sub
Protected Sub GridView1_PageIndexChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewPageEventArgs)
' 重設選取索引
GridView1.SelectedIndex = -1
End Sub
Sub GridView1_Sorting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewSortEventArgs)
' 重設選取索引
GridView1.SelectedIndex = -1
End Sub

GridView 和 DetailsView 還支援一種用於分頁與排序的特殊模式，利用客戶端回呼（callback）操作取得新頁面資料或最近排序過的資料。啟用此特性，必須將 EnableSortingAndPagingCallbacks 屬性設為 true。請注意，執行分頁或排序時，頁面不需回傳（postback）以檢索新值（雖執行了客戶端腳本向伺服器回呼）。當 GridView 或 DetailsView 包含範本欄位時不支援此特性。啟用此特性時，CommandField（命令欄位）中不支援顯示「選取」按鈕。

<asp:GridView AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" DataKeyNames="au_id" DataSourceID="SqlDataSource1" EnableSortingAndPagingCallbacks="True" ID="GridView1" runat="server">
……
</asp:GridView>

雖 GridView、DetailsView 和 FormView 為分頁器（pager）UI 提供預設顯示方式，仍可透過設定 PagerTemplate 屬性自訂分頁器顯示。在此模板中，可放置按鈕控制項，將 CommandName 設為 Page，CommandArgument 設為 First、Prev、Next、Last 或 <number>（特定頁面索引值）。下列範例示範 GridView 和 DetailsView 控制項定義的 PagerTemplate。

<PagerTemplate>
<asp:LinkButton CommandName="Page" CommandArgument="First" ID="LinkButton1" runat="server" Style="color: white">&lt;&lt; First</asp:LinkButton>
<asp:LinkButton CommandName="Page" CommandArgument="Prev" ID="LinkButton2" runat="server" Style="color: white">&lt; Prev</asp:LinkButton>
[Records <%= GridView1.PageIndex * GridView1.PageSize %> - <%= GridView1.PageIndex * GridView1.PageSize + GridView1.PageSize - 1 %>]
<asp:LinkButton CommandName="Page" CommandArgument="Next" ID="LinkButton3" runat="server" Style="color: white">Next &gt;</asp:LinkButton>
<asp:LinkButton CommandName="Page" CommandArgument="Last" ID="LinkButton4" runat="server" Style="color: white">Last &gt;&gt;</asp:LinkButton>
</PagerTemplate>