HOW TO：以動態方式設定 GridView Web 伺服器控制項的資料行寬度

更新：2007 年 11 月

根據預設，GridView 控制項中的資料行會自動調整大小。這些資料行會呈現為 HTML 表格儲存格 (td 項目) 但不具有寬度資訊，大多數瀏覽器會將表格儲存格的大小調整為允許資料行中的最寬內容。

如有必要，您可以程式設計方式設定 GridView 控制項中個別資料行的寬度。如果資料行的寬度會視只在執行階段可用的資訊而定，則這會相當有用。例如，您可能會根據資料行內容 (也就是說，根據 GridView 控制項繫結的資料) 調整其大小。

設定資料行寬度的基本技術包括設定資料行範本的 Width 屬性。如果您要根據其內容設定寬度，則可以處理 RowDataBound 事件。您可以使用資料列資料進行檢查。

若要動態設定資料行寬度

• 在程式碼中，將 GridView 控制項資料行之 ItemStyle 屬性的 Width 屬性設為想要的寬度。

  在下列程式碼中，示範了如何將 GridView1 控制項中所有資料行寬度設為使用者在文字方塊中輸入的值。

  Protected Sub Button1_Click(ByVal sender As Object, _
          ByVal e As System.EventArgs)
      Try
        Dim colWidth As Integer
        colWidth = CInt(Server.HtmlEncode(TextBox1.Text))
        If colWidth > 0 Then
          For i As Integer = 0 To GridView1.Columns.Count - 1
            GridView1.Columns(i).ItemStyle.Width = colWidth
          Next
        End If
      Catch
        ' Report error.
      End Try
  End Sub
  

  protected void Button1_Click(object sender, EventArgs e)
  {
      try
      {
        int colWidth = Int16.Parse(Server.HtmlEncode(TextBox1.Text));
        if (colWidth > 0)
        {
          for (int i = 0; i < GridView1.Columns.Count; i++)
          {
            GridView1.Columns[i].ItemStyle.Width = colWidth;
          }
        }
      }
      catch
      {
        // Report error.      
      }
  }
  

若要根據資料內容設定資料行寬度

1. 建立 RowDataBound 事件的處理常式。

   每次新資料列在方格中進行資料繫結，並可讓您存取每個資料列中的資料時，都會引發 RowDataBound 事件。

2. 在事件處理常式中，請執行下列操作：

   1. 建立 DataRowView 物件，並將其指派給目前方格窗格中之資料列的 DataItem 值。

      DataItem 屬性的型別為物件。因此，您必須將其轉型。

   2. 測試資料列 (DataControlRowType) 以確定您正使用資料繫結的資料列而不是頁首或頁尾。

   3. 從 DataRowView 物件，擷取您要檢查的資料值。

   4. 設定 ItemStyle 屬性的 Width 屬性。

   5. 將 ItemStyle 屬性的 Wrap 屬性設為 false。

      如果 Wrap 屬性為 false，則資料行會自動調整大小。

   在下列程式碼中，示範了如何根據第二個資料行的最寬資料項目寬度，設定資料行的寬度 (在此情況下為第三個資料行)。對每個由 GridView 控制項顯示的資料列呼叫一次 RowDataBound 事件處理常式。程式碼會將最寬項目的字元計數儲存於受保護的網頁成員中。程式碼將資料行的寬度設為字元計數乘以 30 (任意乘數)。

   Protected widestData As Integer
   Protected Sub GridView1_RowDataBound(ByVal sender As Object, _
           ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
       Dim drv As System.Data.DataRowView
       drv = CType(e.Row.DataItem, System.Data.DataRowView)
       If e.Row.RowType = DataControlRowType.DataRow Then
         If drv IsNot Nothing Then
           Dim catName As String = drv(1).ToString()
           Dim catNameLen As Integer = catName.Length
           If catNameLen > widestData Then
             widestData = catNameLen
             GridView1.Columns(2).ItemStyle.Width = _
                 widestData * 30
             GridView1.Columns(2).ItemStyle.Wrap = False
           End If
         End If
       End If
   End Sub
   
   Protected Sub Page_Load(ByVal sender As Object, _
           ByVal e As System.EventArgs) Handles Me.Load
       widestData = 0
   End Sub
   

   protected int widestData;
   protected void GridView1_RowDataBound(object sender, 
       GridViewRowEventArgs e)
   {
       System.Data.DataRowView drv;
       drv = (System.Data.DataRowView)e.Row.DataItem;
       if (e.Row.RowType == DataControlRowType.DataRow)
       {
         if (drv != null)
         {
           String catName = drv[1].ToString();
           Response.Write(catName + "/");
   
           int catNameLen = catName.Length;
           if (catNameLen > widestData)
           {
             widestData = catNameLen;
             GridView1.Columns[2].ItemStyle.Width =
               widestData * 30;
             GridView1.Columns[2].ItemStyle.Wrap = false;
           }
   
         }
       }
   }
   
   protected void Page_Load(object sender, EventArgs e)
   {
       widestData = 0;
   }
   

請參閱

參考

GridView Web 伺服器控制項概觀