asp.net夜话之八：数据绑定控件（三）

asp.net夜话之八：数据绑定控件（三）2011-03-04 csdn博客周金桥Repeater控件

Repeater控件的用法类似于DataList控件，只不过它不能在一行显示多行数据，不过它可以让我们更灵活地控制数据的显示样式。如果Repeater控件中没有定义模版或者模版中没有定义要显示的数据的显示方式，那么在运行时该控件在页面上不会有任何显示。

Repeater服务器控件支持的模版有ItemTemplate、AlternatingItemTemplate、HeaderTemplate和FooterTemplate及SeparatorTemplate，这些模版的用法类似于DataList中对应的模版的用法。

下面是Repeater控件的用法的例子。

首先在页面中拖入一个Repeater控件，拖入Repeater控件之后页面的设计效果如下：

可以看出使用Repeater控件时没有办法在设计视图下编辑控件模版，要编辑控件模版需要切换到源视图。

在ADO.NET一节笔者展示了如何用Table来显示数据，具体做法是现在循环之前输出表头，然后在利用循环输出数据集合中的每条数据，最后在循环结束之后输出table的结束标记。如果在Repeater中想用Table的形式显示数据，我们的做法是如下：

先在HeaderTemplate模版中定义表头，然后在ItemTemplate模版或AlternatingItemTemplate模版中定义数据的每条数据的显示方式，最后在FooterTemplate模版中定义table的结束标记。

下面是前台代码：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RepeaterDemo.aspx.cs" Inherits="RepeaterDemo" %>
<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Repeater服务器控件使用的例子</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table border="1" cellpadding="0" cellspacing="0">
<tr><td>编号</td><td>真实姓名</td><td>年龄</td><td>性别</td><td>手机</td><td>电话</td><td>电子邮件</td></tr>
</HeaderTemplate>
<ItemTemplate>
<tr><td><%#Eval（"UserID"） %></td><td><%#Eval（"RealName"） %></td><td><%#Eval（"Age"） %></td><td><%#bool.Parse（Eval（"sex"）.ToString（））？"男":"<font color="green">女</font>" %></td><td><%#Eval（"Mobile"） %></td><td><%#Eval（"Phone"） %></td><td><%#Eval（"Email"） %></td></tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr><td><input type="text" readonly="readonly" value="<%#Eval（"UserId"） %>" size="2" /></td><td><%#Eval（"RealName"） %></td><td><%#Eval（"Age"） %></td><td><%#bool.Parse（Eval（"sex"）.ToString（））？"男":"<font color="green">女</font>" %></td><td><%#Eval（"Mobile"） %></td><td><%#Eval（"Phone"） %></td><td><%#Eval（"Email"） %></td></tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
</html>