5.14 表控件(Table)
在ASP.NET中,也提供了表控件(Table)来提供可编程的表格服务器控件。表中的行可以通过TableRow创建,而表中的列通过TableCell来实现,当创建一个表控件时,系统生成代码如下所示。
上述代码自动生成了一个表控件代码,但是没有生成表控件中的行和列,必须通过TableRow创建行,通过TableCell来创建列,示例代码如下所示。
上述代码创建了一个两行四列的表,如图5-40所示。
图5-40 表控件
父Table控件支持一些控制整个表的外观的属性,例如字体、背景颜色等,如图5-41所示。TableRow控件和TableCell控件也支持这些属性,同样可以用来指定个别的行或单元格的外观,运行后如图5-42所示。
图5-41 Table的属性设置
图5-42 TableCell控件的属性设置
表控件和静态表的区别在于,表控件能够动态的为表格创建行或列,实现一些特定的程序需求。Web服务器控件中,Table控件中的行是TableRow对象,Table控件中的列是TableCell对象。可以声明这两个对象并初始化,可以为表控件增加行或列,实现动态创建表的程序,HTML核心代码如下所示。
上述代码中,创键了一个二行一列的表格,同时创建了一个Button按钮控件来实现增加一行的效果,cs核心代码如下所示。
上述代码动态的创建了一行并动态的在该行创建了四列,如图5-43所示。单击【增加一列】按钮,系统会在表格中创建新行,运行效果如图5-44所示。
图5-43 原表格
图5-44 动态创建行和列
在动态创建行和列的时候,也能够修改行和列的样式等属性,创建自定义样式的表格。通常,表不仅用来显示表格的信息,还是一种传统的布局网页的形式,创建网页表格有如下几种形式:
?1)HTML格式的表格:如<table>标记显示的静态表格。
?2)HtmlTable控件:将传统的<table>控件通过添加runat=server属性将其转换为服务器控件。
?3)Table表格控件:就是本节介绍的表格控件。
虽然创建表格有以上三种创建方法,但是推荐开发人员在使用静态表格,当不需要对表格做任何逻辑事物处理时,最好使用HTML格式的表格,因为这样可以极大的降低页面逻辑、增强性能。
+展开
-HTML
<asp:Table ID="Table1" runat="server" Height="121px" Width="177px">
</asp:Table>
</asp:Table>
上述代码自动生成了一个表控件代码,但是没有生成表控件中的行和列,必须通过TableRow创建行,通过TableCell来创建列,示例代码如下所示。
+展开
-HTML
<asp:Table ID="Table1" runat="server" Height="121px" Width="177px">
<asp:TableRow>
<asp:TableCell>1.1</asp:TableCell>
<asp:TableCell>1.2</asp:TableCell>
<asp:TableCell>1.3</asp:TableCell>
<asp:TableCell>1.4</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell>2.1</asp:TableCell>
<asp:TableCell>2.2</asp:TableCell>
<asp:TableCell>2.3</asp:TableCell>
<asp:TableCell>2.4</asp:TableCell>
</asp:TableRow>
</asp:Table>
<asp:TableRow>
<asp:TableCell>1.1</asp:TableCell>
<asp:TableCell>1.2</asp:TableCell>
<asp:TableCell>1.3</asp:TableCell>
<asp:TableCell>1.4</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell>2.1</asp:TableCell>
<asp:TableCell>2.2</asp:TableCell>
<asp:TableCell>2.3</asp:TableCell>
<asp:TableCell>2.4</asp:TableCell>
</asp:TableRow>
</asp:Table>
上述代码创建了一个两行四列的表,如图5-40所示。
图5-40 表控件
父Table控件支持一些控制整个表的外观的属性,例如字体、背景颜色等,如图5-41所示。TableRow控件和TableCell控件也支持这些属性,同样可以用来指定个别的行或单元格的外观,运行后如图5-42所示。
图5-41 Table的属性设置
图5-42 TableCell控件的属性设置
表控件和静态表的区别在于,表控件能够动态的为表格创建行或列,实现一些特定的程序需求。Web服务器控件中,Table控件中的行是TableRow对象,Table控件中的列是TableCell对象。可以声明这两个对象并初始化,可以为表控件增加行或列,实现动态创建表的程序,HTML核心代码如下所示。
+展开
-HTML
<body style="font-style: italic">
<form id="form1" runat="server">
<div>
<asp:Table ID="Table1" runat="server" Height="121px" Width="177px"
BackColor="Silver">
<asp:TableRow>
<asp:TableCell>1.1</asp:TableCell>
<asp:TableCell>1.2</asp:TableCell>
<asp:TableCell>1.3</asp:TableCell>
<asp:TableCell BackColor="White">1.4</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell>2.1</asp:TableCell>
<asp:TableCell BackColor="White">2.2</asp:TableCell>
<asp:TableCell>2.3</asp:TableCell>
<asp:TableCell>2.4</asp:TableCell>
</asp:TableRow>
</asp:Table>
<br >
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="增加一行" />
</div>
</form>
</body>
<form id="form1" runat="server">
<div>
<asp:Table ID="Table1" runat="server" Height="121px" Width="177px"
BackColor="Silver">
<asp:TableRow>
<asp:TableCell>1.1</asp:TableCell>
<asp:TableCell>1.2</asp:TableCell>
<asp:TableCell>1.3</asp:TableCell>
<asp:TableCell BackColor="White">1.4</asp:TableCell>
</asp:TableRow>
<asp:TableRow>
<asp:TableCell>2.1</asp:TableCell>
<asp:TableCell BackColor="White">2.2</asp:TableCell>
<asp:TableCell>2.3</asp:TableCell>
<asp:TableCell>2.4</asp:TableCell>
</asp:TableRow>
</asp:Table>
<br >
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="增加一行" />
</div>
</form>
</body>
上述代码中,创键了一个二行一列的表格,同时创建了一个Button按钮控件来实现增加一行的效果,cs核心代码如下所示。
+展开
-C#
namespace _5_14
{
public partial class _Default : System.Web.UI.Page
{
public TableRow row = new TableRow();//定义一个TableRow对象
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
Table1.Rows.Add(row);//创建一个新行
for (int i = 0; i < 4; i++)//遍历四次创建新列
{
TableCell cell = new TableCell();//定义一个TableCell对象
cell.Text = "3."+i.ToString();//编写TableCell对象的文本
row.Cells.Add(cell);//增加列
}
}
}
}
{
public partial class _Default : System.Web.UI.Page
{
public TableRow row = new TableRow();//定义一个TableRow对象
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click(object sender, EventArgs e)
{
Table1.Rows.Add(row);//创建一个新行
for (int i = 0; i < 4; i++)//遍历四次创建新列
{
TableCell cell = new TableCell();//定义一个TableCell对象
cell.Text = "3."+i.ToString();//编写TableCell对象的文本
row.Cells.Add(cell);//增加列
}
}
}
}
上述代码动态的创建了一行并动态的在该行创建了四列,如图5-43所示。单击【增加一列】按钮,系统会在表格中创建新行,运行效果如图5-44所示。
图5-43 原表格
图5-44 动态创建行和列
在动态创建行和列的时候,也能够修改行和列的样式等属性,创建自定义样式的表格。通常,表不仅用来显示表格的信息,还是一种传统的布局网页的形式,创建网页表格有如下几种形式:
?1)HTML格式的表格:如<table>标记显示的静态表格。
?2)HtmlTable控件:将传统的<table>控件通过添加runat=server属性将其转换为服务器控件。
?3)Table表格控件:就是本节介绍的表格控件。
虽然创建表格有以上三种创建方法,但是推荐开发人员在使用静态表格,当不需要对表格做任何逻辑事物处理时,最好使用HTML格式的表格,因为这样可以极大的降低页面逻辑、增强性能。
加支付宝好友偷能量挖...