On a Web Forms page, the Table Web server control creates a general-purpose table. Rows in the table are created as TableRow Web server controls, and cells within each row are implemented as TableCell
Web server controls. The Table Web server control allows us to create server-programmable tables on our Web Forms page. The TableRow
and TableCell
Web server controls provide a way to display the actual content for the Table
control.
Comparing the Table Web Server Control to Other Table Elements
Tables are typically used not just to present tabular information, but also as a method of formatting information on a Web page. There are many ways to create tables on our Web Forms page:
HTML table: We can add a <TABLE>
element from the HTML tab of the Toolbox.
HtmlTable control: This is a <TABLE>
HTML element that has been converted to a control by adding the runat=server
attribute. We can program this control in server code.
Table Web Server control: A Web control that allows us to create and manipulate tables using an object model that is consistent with other Web controls (for example, adding table rows and cells).
In general, when we intend to add rows and cells (columns) to the table in code at run time, we use a Table Web server control. Although we can use it as a static table with predefined rows and columns, in that case it is easier to work with the HTML <TABLE>
element.
Because the Table Web server control offers an object model with typed properties that is consistent with other Web server controls, it can be easier to program than the HtmlTable
control. (The model is also consistent between the Table
, TableRow
, and TableCell
controls.)
Comparing the Table Web Server Control to Other List Web Server Controls
We might accomplish some of the functions with a Table Web server control; we can also accomplish this with the list Web server controls: the Repeater
, DataList
, and DataGrid
controls. All of these controls render (or have the option to render) as HTML tables.
The differences between the list controls and the Table control are:
- The list controls are data-bound; they work only against a data source, whereas the
Table
control can display any combination of HTML text and controls, whether or not they are data-bound. - To specify the layout of their elements the list controls use templates. The
Table
control supports theTableCell
child control, which we can fill as we would any HTML<TD>
element.
Table Web Server Control Object Model
For TableRow
controls the Table
control acts as a parent control. The table supports a property called Rows
that is a collection of TableRow
objects. We specify the rows for the table by managing this collection — adding or deleting items in it —. The TableRow
control in turn supports a collection called Cells
of TableCell
objects.
The content to be displayed in the table is added to the TableCell
control. The cell has a Text
property that we set to any HTML text. Alternatively, we can display controls in the cell by creating instances of, and adding controls to, the cell's Controls collection.
To control the appearance of the entire table, such as Font
, BackColor
, and ForeColor
, the parent Table
control supports properties. These properties are supported by The TableRow
and TableCell
controls as well, therefore, overriding the parent table appearance we can specify the look of individual rows or cells.
Binding Data to the Control
We can use the Table
control (unlike the list Web server controls; see above) to display data from a database although it is not inherently data bound.
We can bind any property of a Table
control to a data source as with all Web server controls. However, the Table
control does not support a property that we use to display data directly. Instead, we typically add TableCell
controls to the table. We can then either bind the Text
property of individual TableCell
controls to data, or we can add data-bound controls (such as a Label
or TextBox
control) to the cell.
Comments