共用方式為

在 DetailsView Web 伺服器控制項置入分頁

  • 發行項

更新：2007 年 11 月

ASP.NET DetailsView 控制項具備內建支援，可以讓使用者一個接著一個地瀏覽資料錄。控制項也支援自訂分頁使用者介面 (UI)。在 DetailsView 控制項中，一頁資料為單一繫結的資料列。

分頁在 DetailsView 控制項中的運作方式

DetailsView 控制項支援對其資料來源中的資料錄進行分頁。若要啟用分頁行為，必須將 AllowPaging 屬性 (Property) 設為 true。DetailsView 控制項所要求的頁面大小固定為一個資料列。

如果 DetailsView 控制項繫結至資料來源控制項，或繫結至任何實作 ICollection 介面 (包括資料集) 的資料結構，則控制項會從資料來源取得所有資料錄、顯示目前頁面的資料錄，以及捨棄其他資料錄。當使用者移至其他頁面時，DetailsView 控制項會重複處理程序，以顯示不同的資料錄。

注意事項：

如果資料來源沒有實作 ICollection 介面，則 DetailsView 控制項無法分頁。例如，如果您使用 SqlDataSource 控制項並且設定其 DataSourceMode 屬性為 DataReader，則 DetailsView 控制項無法實作分頁。

有些資料來源 (例如 ObjectDataSource 控制項) 會提供更進階的分頁能力。在這些情況中，DetailsView 控制項會利用資料來源更進階的能力，在分頁時取得更佳的效能和彈性。要求的資料列數可能依據資料來源是否支援取得總資料列計數而所有不同。

注意事項：

如果您要建立資料來源 (例如，在 ObjectDataSource 控制項的來源物件中實作 SelectCountMethod 方法)，我們強烈建議您在提供資料頁面時，讓資料來源傳回總資料列計數。這會將 DetailsView 控制項為擷取資料頁面而必須要求的資料錄數目最小化。如果總資料列計數由資料來源物件提供，DetailsView 控制項則一次只會為每個頁面要求一個資料列。如果沒有提供總資料列計數，DetailsView 控制項就必須向資料來源要求所有資料列 (從表示所要求之資料頁面的資料列開始) 並捨棄所顯示之資料列以外的資料列。

自訂分頁設定和使用者介面

您可以用很多種方式自訂 DetailsView 分頁的使用者介面 (UI)。

分頁模式

當您將 AllowPaging 屬性設為 true 時，PagerSettings 屬性可以讓您自訂 DetailsView 控制項所產生的分頁使用者介面 (UI) 外觀。DetailsView 控制項可以顯示方向控制項 (具備向前和向後巡覽的功能) 和數字控制項 (讓使用者可以移至特定的頁面)。

DetailsView 控制項的 PagerSettings 屬性設定為 PagerSettings 類別。透過將 DetailsView 控制項的 Mode 屬性設定為 PagerButtons 值，即可自訂分頁模式。例如，您可以用下列設定方式來自訂分頁 UI 模式：

DetailsView1.PagerSettings.Mode = PagerButtons.NextPreviousFirstLast

可用的模式包括：

頁面巡覽區控制項外觀

DetailsView 控制項有許多屬性，您可以用這些屬性來自訂不同頁面巡覽區模式的文字和影像。例如，如果您將 DetailsView 控制項的分頁模式設定為 NextPrevious 並要自訂顯示的文字，可以將 NextPageText 和 PreviousPageText 屬性設定為您自己的值。根據預設，PreviousPageText 和 NextPageText 屬性會分別設定為 "<" 和 ">"。

也可以使用影像來自訂分頁控制項的外觀。PagerSettings 類別包含第一頁、最後一頁、前一頁和下一頁命令按鈕的影像 URL 屬性。

最後，透過將 DetailsView 控制項的 PagerStyle 屬性設定為 TableItemStyle 值，即可控制分頁命令的外觀。

資料分頁範本

如果您設定 DetailsView 控制項的 AllowPaging 屬性為 true，則 DetailsView 控制項會自動加入分頁的使用者介面 (UI) 控制項。您可以加入 PagerTemplate 範本，即可自訂分頁的 UI。若要指定要執行的分頁作業，請將 Button 控制項加入範本，然後將控制項的 CommandName 屬性設定為 Page 並將控制項的 CommandArgument 屬性設定為下列其中一個值：

  • First，巡覽至第一頁。

  • Last，巡覽至最後一頁。

  • Prev，巡覽至前一頁。

  • Next，巡覽至資料的下一頁。

  • 數字，指示特定的頁面。

下列程式碼範例會示範設定為提供分頁的 DetailsView 控制項。

<%@ Page language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head >
    <title>DetailsView Example</title>
</head>
<body>
    <form id="form1" >
      <h3>DetailsView Example</h3>
        <table cellspacing="10"> 
          <tr>               
            <td valign="top">

              <asp:DetailsView ID="EmployeesDetailsView"
                DataSourceID="EmployeesSqlDataSource"
                AutoGenerateRows="false"
                AllowPaging="true"
                DataKeyNames="EmployeeID"     
                >

                <HeaderStyle forecolor="white" backcolor="Blue" />                

                <Fields>
                  <asp:BoundField Datafield="EmployeeID" HeaderText="Employee ID" ReadOnly="true"/>                    
                  <asp:BoundField Datafield="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField Datafield="LastName"   HeaderText="Last Name"/>                    
                </Fields>

                <PagerSettings Mode="NextPreviousFirstLast"
                               FirstPageText="<<"
                               LastPageText=">>"
                               PageButtonCount="1"  
                               Position="Top"/> 
              </asp:DetailsView>

            </td>
          </tr>
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource" 
          SelectCommand="SELECT * FROM [Employees]" 
          connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server"/>

      </form>
  </body>
</html>

<%@ Page language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head >
    <title>DetailsView Example</title>
</head>
<body>
    <form id="form1" >
      <h3>DetailsView Example</h3>
        <table cellspacing="10"> 
          <tr>               
            <td valign="top">

              <asp:DetailsView ID="EmployeesDetailsView"
                DataSourceID="EmployeesSqlDataSource"
                AutoGenerateRows="false"
                AllowPaging="true"
                DataKeyNames="EmployeeID"     
                >

                <HeaderStyle forecolor="white" backcolor="Blue" />                

                <Fields>
                  <asp:BoundField Datafield="EmployeeID" HeaderText="Employee ID" ReadOnly="true"/>                    
                  <asp:BoundField Datafield="FirstName"  HeaderText="First Name"/>
                  <asp:BoundField Datafield="LastName"   HeaderText="Last Name"/>                    
                </Fields>

                <PagerSettings Mode="NextPreviousFirstLast"
                               FirstPageText="<<"
                               LastPageText=">>"
                               PageButtonCount="1"  
                               Position="Top"/> 
              </asp:DetailsView>

            </td>
          </tr>
        </table>

        <asp:SqlDataSource ID="EmployeesSqlDataSource" 
          SelectCommand="SELECT * FROM [Employees]" 
          connectionstring="<%$ ConnectionStrings:NorthwindConnection %>" 
          RunAt="server"/>

      </form>
  </body>
</html>

請參閱

參考

DetailsView Web 伺服器控制項概觀