.NET Framework Class Library
HtmlTable Class

Allows programmatic access on the server to the HTML <table> element.

Namespace:  System.Web.UI.HtmlControls
Assembly:  System.Web (in System.Web.dll)
Syntax

Visual Basic (Declaration)
<AspNetHostingPermissionAttribute(SecurityAction.LinkDemand, Level := AspNetHostingPermissionLevel.Minimal)> _
<AspNetHostingPermissionAttribute(SecurityAction.InheritanceDemand, Level := AspNetHostingPermissionLevel.Minimal)> _
Public Class HtmlTable _
    Inherits HtmlContainerControl
Visual Basic (Usage)
Dim instance As HtmlTable
C#
[AspNetHostingPermissionAttribute(SecurityAction.LinkDemand, Level = AspNetHostingPermissionLevel.Minimal)]
[AspNetHostingPermissionAttribute(SecurityAction.InheritanceDemand, Level = AspNetHostingPermissionLevel.Minimal)]
public class HtmlTable : HtmlContainerControl
Visual C++
[AspNetHostingPermissionAttribute(SecurityAction::LinkDemand, Level = AspNetHostingPermissionLevel::Minimal)]
[AspNetHostingPermissionAttribute(SecurityAction::InheritanceDemand, Level = AspNetHostingPermissionLevel::Minimal)]
public ref class HtmlTable : public HtmlContainerControl
JScript
public class HtmlTable extends HtmlContainerControl
ASP.NET
<asp:HtmlTable />
Remarks

Use the HtmlTable control to programmatically control the HTML <table> element on the server. This allows you to create a table on a Web page.

You can dynamically change the appearance of the <table> element by setting the BgColor, Border, BorderColor, Height, and Width properties. You can also control how the content of a cell is displayed by setting the Align, CellPadding, and CellSpacing properties.

The rows of the HtmlTable control are stored in the Rows property of the control. This allows you to programmatically access the individual rows of the table.

NoteNote:

A complex table model is not supported. You cannot have an HtmlTable control with nested <caption>, <col>, <colgroup>, <tbody>, <thead>, or <tfoot> elements. These elements are removed without warning and do not appear in the output HTML. An exception will be thrown if you attempt to programmatically add these table model elements to the Control..::.Controls collection of the HtmlTable control.

For a list of initial property values for an instance of HtmlTable, see the HtmlTable constructor.

TopicLocation
How to: Add HTML Server Controls to a Web Page Using ASP.NET SyntaxBuilding ASP .NET Web Applications
How to: Add HTML Server Controls to a Web Page Using ASP.NET SyntaxBuilding ASP .NET Web Applications
How to: Add HTML Server Controls to a Web Page Using ASP.NET SyntaxBuilding ASP .NET Web Applications in Visual Studio
How to: Add HTML Server Controls to a Web Page Using ASP.NET SyntaxBuilding ASP .NET Web Applications in Visual Studio
How to: Add Rows and Cells Dynamically to a Table Web Server ControlBuilding ASP .NET Web Applications
How to: Add Rows and Cells Dynamically to a Table Web Server ControlBuilding ASP .NET Web Applications
How to: Add Rows and Cells Dynamically to a Table Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Add Rows and Cells Dynamically to a Table Web Server ControlBuilding ASP .NET Web Applications in Visual Studio
How to: Create and Edit HTML Tables in Design ViewBuilding ASP .NET Web Applications in Visual Studio
How to: Create and Edit HTML Tables in Design ViewBuilding ASP .NET Web Applications in Visual Studio
How to: Create and Edit HTML Tables in Design ViewBuilding ASP .NET Web Applications in Visual Studio
How to: Resize HTML Table ElementsBuilding ASP .NET Web Applications in Visual Studio
How to: Resize HTML Table ElementsBuilding ASP .NET Web Applications in Visual Studio
How to: Resize HTML Table ElementsBuilding ASP .NET Web Applications in Visual Studio
How to: Select HTML Table Elements and ContentsBuilding ASP .NET Web Applications in Visual Studio
How to: Select HTML Table Elements and ContentsBuilding ASP .NET Web Applications in Visual Studio
How to: Select HTML Table Elements and ContentsBuilding ASP .NET Web Applications in Visual Studio
How to: Set HTML Server Control Properties ProgrammaticallyBuilding ASP .NET Web Applications
How to: Set HTML Server Control Properties ProgrammaticallyBuilding ASP .NET Web Applications
How to: Set HTML Server Control Properties ProgrammaticallyBuilding ASP .NET Web Applications in Visual Studio
How to: Set HTML Server Control Properties ProgrammaticallyBuilding ASP .NET Web Applications in Visual Studio
Examples

The following code example demonstrates how to use an HtmlTable control to display information in a table.

Visual Basic
<%@ Page Language="VB" AutoEventWireup="True" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  Sub Button_Click(ByVal sender As Object, ByVal e As EventArgs)

    ' Set the properties of the HtmlTable with the
    ' user selections.
    Table1.BgColor = BgColorSelect.Value
    Table1.Border = CInt(BorderSelect.Value)
    Table1.BorderColor = BorderColorSelect.Value
    Table1.Height = HeightSelect.Value
    Table1.Width = WidthSelect.Value

  End Sub

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black"
             runat="server">

         <tr>
            <th>
               Column 1
            </th>
            <th>
               Column 2
            </th>
            <th>
               Column 3
            </th>
         </tr>
         <tr>
            <td>
               Cell 1
            </td>
            <td>
               Cell 2
            </td>
            <td>
               Cell 3
            </td>
         </tr>
         <tr>
            <td>
               Cell 4
            </td>
            <td>
               Cell 5
            </td>
            <td>
               Cell 6
            </td>
         </tr>

      </table>

      <hr />

      Select the display settings: <br /><br />

      BgColor:
      <select id="BgColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black">Black</option>
         <option value="White" selected="selected">White</option>

      </select>

      &nbsp;&nbsp;

      Border:
      <select id="BorderSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="1" selected="selected">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      BorderColor:
      <select id="BorderColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black" selected="selected">Black</option>
         <option value="White">White</option>

      </select>

      <br /><br />

      Height:
      <select id="HeightSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="100">100</option>
         <option value="150">150</option>
         <option value="200">200</option>
         <option value="250">250</option>

      </select>

      &nbsp;&nbsp;

      Width:
      <select id="WidthSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="200">200</option>
         <option value="250">250</option>
         <option value="300">300</option>
         <option value="350">350</option>

      </select>

      <br /><br />

      <input type="button" 
             value="Generate Table"
             onserverclick ="Button_Click" 
             runat="server"/>

   </form>

</body>
</html>
C#
<%@ Page Language="C#" AutoEventWireup="True" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  void Button_Click(Object sender, EventArgs e)
  {

    // Set the properties of the HtmlTable with the
    // user selections.
    Table1.BgColor = BgColorSelect.Value;
    Table1.Border = Convert.ToInt32(BorderSelect.Value);
    Table1.BorderColor = BorderColorSelect.Value;
    Table1.Height = HeightSelect.Value;
    Table1.Width = WidthSelect.Value;

  }

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black"
             runat="server">

         <tr>
            <th>
               Column 1
            </th>
            <th>
               Column 2
            </th>
            <th>
               Column 3
            </th>
         </tr>
         <tr>
            <td>
               Cell 1
            </td>
            <td>
               Cell 2
            </td>
            <td>
               Cell 3
            </td>
         </tr>
         <tr>
            <td>
               Cell 4
            </td>
            <td>
               Cell 5
            </td>
            <td>
               Cell 6
            </td>
         </tr>

      </table>

      <hr />

      Select the display settings: <br /><br />

      BgColor:
      <select id="BgColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black">Black</option>
         <option value="White" selected="selected">White</option>

      </select>

      &nbsp;&nbsp;

      Border:
      <select id="BorderSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="1" selected="selected">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      BorderColor:
      <select id="BorderColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black" selected="selected">Black</option>
         <option value="White">White</option>

      </select>

      <br /><br />

      Height:
      <select id="HeightSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="100">100</option>
         <option value="150">150</option>
         <option value="200">200</option>
         <option value="250">250</option>

      </select>

      &nbsp;&nbsp;

      Width:
      <select id="WidthSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="200">200</option>
         <option value="250">250</option>
         <option value="300">300</option>
         <option value="350">350</option>

      </select>

      <br /><br />

      <input type="button" 
             value="Generate Table"
             onserverclick="Button_Click" 
             runat="server"/>

   </form>

</body>
</html>
JScript
<%@ Page Language="JScript" AutoEventWireup="True" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  function Button_Click(sender : Object, e : EventArgs)
  { 

    // Set the properties of the HtmlTable with the
    // user selections.
    Table1.BgColor = BgColorSelect.Value;
    Table1.Border = Convert.ToInt32(BorderSelect.Value);
    Table1.BorderColor = BorderColorSelect.Value;
    Table1.Height = HeightSelect.Value;
    Table1.Width = WidthSelect.Value;

  }

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black" 
             runat="server">

         <tr>
            <th>
               Column 1
            </th>
            <th>
               Column 2
            </th>
            <th>
               Column 3
            </th>
         </tr>
         <tr>
            <td>
               Cell 1
            </td>
            <td>
               Cell 2
            </td>
            <td>
               Cell 3
            </td>
         </tr>
         <tr>
            <td>
               Cell 4
            </td>
            <td>
               Cell 5
            </td>
            <td>
               Cell 6
            </td>
         </tr>

      </table>

      <hr />

      Select the display settings: <br /><br />

      BgColor:
      <select id="BgColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black">Black</option>
         <option value="White" selected="selected">White</option>

      </select>

      &nbsp;&nbsp;

      Border:
      <select id="BorderSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="1" selected="selected">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      BorderColor:
      <select id="BorderColorSelect" 
              runat="server">

         <option value="Red">Red</option>
         <option value="Blue">Blue</option>
         <option value="Green">Green</option>
         <option value="Black" selected="selected">Black</option>
         <option value="White">White</option>

      </select>

      <br /><br />

      Height:
      <select id="HeightSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="100">100</option>
         <option value="150">150</option>
         <option value="200">200</option>
         <option value="250">250</option>

      </select>

      &nbsp;&nbsp;

      Width:
      <select id="WidthSelect" 
              runat="server">

         <option value="0">0</option>
         <option value="200">200</option>
         <option value="250">250</option>
         <option value="300">300</option>
         <option value="350">350</option>

      </select>

      <br /><br />

      <input type="button" 
             value="Generate Table"
             onserverclick="Button_Click" 
             runat="server"/>

   </form>

</body>
</html>

The following code example demonstrates how to dynamically create an HtmlTable control.

Visual Basic
<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

    Dim i As Integer
    Dim j As Integer
    Dim row As HtmlTableRow
    Dim cell As HtmlTableCell

    ' Get the number of rows and columns selected by the user.
    Dim numrows As Integer = CInt(Select1.Value)
    Dim numcells As Integer = CInt(Select2.Value)

    ' Iterate through the rows.
    For j = 0 To numrows - 1

      ' Create a new row.
      row = New HtmlTableRow()

      ' Provide a different background color for alternating rows.
      If (j Mod 2) = 1 Then
        row.BgColor = "Gray"
      End If

      ' Iterate through the cells of a row.
      For i = 0 To numcells - 1

        ' Create a new cell and add it to the HtmlTableRow
        ' Cells collection.
        cell = New HtmlTableCell()
        cell.Controls.Add(New LiteralControl("row " & _
                                          j.ToString() & _
                                          ", cell " & _
                                          i.ToString()))
        row.Cells.Add(cell)

      Next i

      ' Add the row to the HtmlTable Rows collection.
      Table1.Rows.Add(row)

    Next j

  End Sub

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black; padding:5"
             cellspacing="0" 
             runat="server"/>

      <hr />

      Select the number of rows and columns to create: <br /><br />

      Table rows:
      <select id="Select1" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      Table cells:
      <select id="Select2" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      <br /><br />

      <input type="submit" 
             value="Generate Table" 
             runat="server"/>

   </form>

</body>
</html>
C#
<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  void Page_Load(Object sender, EventArgs e)
  {

    // Get the number of rows and columns selected by the user.
    int numrows = Convert.ToInt32(Select1.Value);
    int numcells = Convert.ToInt32(Select2.Value);

    // Iterate through the rows.
    for (int j = 0; j < numrows; j++)
    {

      // Create a new row and add it to the Rows collection.
      HtmlTableRow row = new HtmlTableRow();

      // Provide a different background color for alternating rows.
      if (j % 2 == 1)
        row.BgColor = "Gray";

      // Iterate through the cells of a row.
      for (int i = 0; i < numcells; i++)
      {
        // Create a new cell and add it to the HtmlTableRow 
        // Cells collection.
        HtmlTableCell cell = new HtmlTableCell();
        cell.Controls.Add(new LiteralControl("row " +
                          j.ToString() +
                          ", cell " +
                          i.ToString()));
        row.Cells.Add(cell);
      }

      // Add the row to the HtmlTable Rows collection.
      Table1.Rows.Add(row);
    }
  }

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black; padding:5"
             cellspacing="0" 
             runat="server"/>

      <hr />

      Select the number of rows and columns to create: <br /><br />

      Table rows:
      <select id="Select1" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      Table cells:
      <select id="Select2" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      <br /><br />

      <input type="submit" 
             value="Generate Table" 
             runat="server"/>

   </form>

</body>
</html>
JScript
<%@ Page Language="JScript" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  function Page_Load(sender : Object, e : EventArgs) 
  {

    // Get the number of rows and columns selected by the user.
    var numrows : int = Convert.ToInt32(Select1.Value);
    var numcells : int = Convert.ToInt32(Select2.Value);

    // Iterate through the rows.
    for (var j : int = 0; j < numrows; j++) 
    {

      // Create a new row and add it to the Rows collection.
      var row : HtmlTableRow = new HtmlTableRow();

      // Provide a different background color for alternating rows.
      if (j%2 == 1)
        row.BgColor="Gray";

      // Iterate through the cells of a row.
      for (var i : int = 0; i < numcells; i++) 
      {
        // Create a new cell and add it to the HtmlTableRow 
        // Cells collection.
        var cell : HtmlTableCell = new HtmlTableCell();
        cell.Controls.Add(new LiteralControl("row " + 
                      j.ToString() + 
                      ", cell " +
                     i.ToString()));
        row.Cells.Add(cell);
      }

      // Add the row to the HtmlTable Rows collection.
      Table1.Rows.Add(row);
    }
  }

</script>

<html  >
<head>
   <title>HtmlTable Example</title>
</head>
<body>

   <form id="form1" runat="server">

      <h3>HtmlTable Example</h3>

      <table id="Table1" 
             style="border-width:1; border-color:Black; padding:5"
             cellspacing="0" 
             runat="server"/>

      <hr />

      Select the number of rows and columns to create: <br /><br />

      Table rows:
      <select id="Select1" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      &nbsp;&nbsp;

      Table cells:
      <select id="Select2" 
              runat="server">

         <option value="1">1</option>
         <option value="2">2</option>
         <option value="3">3</option>
         <option value="4">4</option>
         <option value="5">5</option>

      </select>

      <br /><br />

      <input type="submit" 
             value="Generate Table" 
             runat="server"/>

   </form>

</body>
</html>
.NET Framework Security

Inheritance Hierarchy

System..::.Object
  System.Web.UI..::.Control
    System.Web.UI.HtmlControls..::.HtmlControl
      System.Web.UI.HtmlControls..::.HtmlContainerControl
        System.Web.UI.HtmlControls..::.HtmlTable
Thread Safety

Any public static (Shared in Visual Basic) members of this type are thread safe. Any instance members are not guaranteed to be thread safe.
Platforms

Windows 7, Windows Vista, Windows XP SP2, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP Starter Edition, Windows Server 2008 R2, Windows Server 2008, Windows Server 2003, Windows Server 2000 SP4, Windows Millennium Edition, Windows 98

The .NET Framework and .NET Compact Framework do not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.
Version Information

.NET Framework

Supported in: 3.5, 3.0, 2.0, 1.1, 1.0
See Also

Reference

Other Resources

Tags :


Page view tracker