Gewusst wie: Dynamisches Festlegen der Spaltenbreite des GridView-Webserver-Steuerelements

Aktualisiert: November 2007

Standardmäßig wird die Größe der Spalten im GridView-Steuerelement automatisch angepasst. Spalten werden als HTML-Tabellenzellen (td-Elemente) ohne Breiteninformationen dargestellt. In den meisten Browsern wird die Größe von Tabellenzellen so festgelegt, dass der Inhalt möglichst breit in der Spalte angezeigt werden kann.

Sofern erforderlich, können Sie die Breite von einzelnen Spalten im GridView-Steuerelement programmgesteuert festlegen. Dies ist dann von Nutzen, wenn die Breite der Spalte von den Informationen abhängig ist, die nur zur Laufzeit verfügbar sind. Beispielsweise können Sie die Größe einer Spalte anhand des Inhalts festlegen – das heißt, auf der Grundlage der Daten, an die das GridView-Steuerelement gebunden wird.

Das grundlegende Verfahren zum Festlegen der Spaltenbreite besteht im Festlegen der Width-Eigenschaft einer Spaltenvorlage. Wenn die Breite anhand des Inhalts festgelegt werden soll, können Sie das RowDataBound-Ereignis behandeln. Dadurch werden die Zeilendaten für Sie zur Überprüfung verfügbar gemacht.

So legen Sie die Spaltenbreite dynamisch fest

• Legen Sie im Code die Width-Eigenschaft der ItemStyle-Eigenschaft für eine Spalte des GridView-Steuerelements auf die gewünschte Breite fest.

  Im folgenden Codebeispiel wird veranschaulicht, wie die Breite aller Spalten im GridView1-Steuerelement auf den Wert festgelegt wird, den ein Benutzer in ein Textfeld eingibt.

  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.      
      }
  }
  

So legen Sie die Spaltenbreite anhand des Dateninhalts fest

1. Erstellen Sie einen Handler für das RowDataBound-Ereignis.

   Das RowDataBound-Ereignis wird immer dann ausgelöst, wenn eine neue Zeile im Datenblatt an Daten gebunden wird und Ihnen der Zugriff auf die Zeilendaten gewährt wird.

2. Gehen Sie im Ereignishandler wie folgt vor:

   1. Erstellen Sie ein DataRowView-Objekt, und weisen Sie ihm den DataItem-Wert für die aktuelle Datenblattzeile zu.

      Die DataItem-Eigenschaft wird als Objekt typisiert. Deshalb müssen Sie sie umwandeln.

   2. Führen Sie eine Überprüfung auf eine Datenzeile aus (DataControlRowType), um sicherzustellen, dass es sich um eine datengebundene Zeile und nicht um eine Kopfzeile oder eine Fußzeile handelt.

   3. Extrahieren Sie den zu untersuchenden Datenwert aus dem DataRowView-Objekt.

   4. Legen Sie die Width-Eigenschaft für die ItemStyle-Eigenschaft fest.

   5. Legen Sie die Wrap-Eigenschaft der ItemStyle-Eigenschaft auf false fest.

      Wenn die Wrap-Eigenschaft false ist, wird die Größe der Spalte automatisch geändert.

   Im folgenden Codebeispiel wird veranschaulicht, wie die Breite einer Spalte (in diesem Fall der dritten Spalte) anhand der Breite des breitesten Datenelements der zweiten Spalte festgelegt wird. Der RowDataBound-Ereignishandler wird für jede Datenzeile einmal aufgerufen, die vom GridView-Steuerelement angezeigt wird. Im Code wird die Zeichenanzahl des breitesten Elements in einem Member für eine geschützte Seite gespeichert. Der Code legt die Breite der Spalte auf die Zeichenanzahl mal 30 fest (ein beliebiger Multiplikator).

   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;
   }
   

Siehe auch

Referenz

Übersicht über das GridView-Webserversteuerelement