Repeater与Table的配合使用
table-repeater
<asp:Repeater id=Repeater1 runat="server" >
<HeaderTemplate>
<table width="100%" style="font: 8pt verdana">
<tr style="background-color:DFA894">
<th> First Name </th>
<th> Last Name </th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%# DataBinder.Eval(Container, "DataItem.EmployeeName") %>
</td>
<td><%# DataBinder.Eval(Container,"DataItem.PhoneNumber") %>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr>
<td bgcolor="lightblue">
<%# DataBinder.Eval(Container, "DataItem.EmployeeName") %> </td>
<td bgcolor="lightblue">
<%# DataBinder.Eval(Container,"DataItem.PhoneNumber") %> </td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate> </table> </FooterTemplate>
</asp:Repeater>
2
Two
<table width="775" border="0" cellspacing="2" cellpadding="0" align="center">
<tr>
<td align="center" height="25" class="Login1" width="40%">
新闻名称</td>
<td align="center" class="Login1">
分类</td>
<td align="center" class="Login1">
查看</td>
<td align="center" class="Login1" width="170">
添加时间</td>
<td align="center" class="Login1" width="100">
编辑/删除</td>
</tr>
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<tr>
<td align="left" class="Login2" height="25">
<a href="../View.aspx?id=<%#Eval("id") %>" target="_blank"><%#Eval("Titel") %></a></td>
<td align="center" class="Login2">
<%#Eval("Class") %>
</td>
<td align="center" class="Login2">
<a href="../view.aspx?id=<%#Eval("id") %>" target="_blank">查看</a></td>
<td align="center" class="Login2">
<%#Eval("Time") %>
</td>
<td align="center" class="Login2">
<a href="EditNews.aspx?id=<%#Eval("id") %>">编辑</a>
<asp:LinkButton ID="LinkButton1" CommandName='<%#Eval("id") %>' OnCommand="DelComm_Click"
OnClientClick="return confirm('确定要删除吗?');" runat="server">删除</asp:LinkButton></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
3
CSS Repeater - 交错显示行背景色 table行鼠标进入事件特效 禁止文本换行
1. 禁止文本换行的CSS: white-space:nowrap;
strict mode下在IE7和FF中都正常，以前IE用的word-break、word-wrap属性对FF无效。
2. Repeater控件，交替显示table行的背景颜色，鼠标移动到某一行时用特殊背景显示。
方法purecss给出了很多种，看了一下现在新浪邮箱，使用的也是文章中选择的方法。
repeater控件:
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table class="list" cellpadding="0" cellspacing="0">
<tr class="listheader">
<th> </th>
<th>查看</th>
<th>编辑</th>
<th>模板ID</th>
<th>用户编号</th>
<th>描述</th>
<th>状态</th>
<th>控制类</th>
<th>模板内容</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr class="listitem1" onmouseover="this.className='over'" onmouseout="this.className='listitem1'">
<td class="cmdtd">
<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:HiddenField ID="templateID" runat="server" Value='<%# DataBinder.Eval(Container.DataItem, "ID")%>'/>
</td>
<td class="cmdtd">
<asp:ImageButton ID="cmdView" runat="server" ImageUrl="http://www.cnblogs.com/Skin/default/icon_view.gif" CausesValidation="False"
OnCommand="cmdView_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
</asp:ImageButton>
</td>
<td class="cmdtd">
<asp:ImageButton ID="cmdEdit" runat="server" ImageUrl="http://www.cnblogs.com/Skin/default/icon_edit.gif" CausesValidation="False"
OnCommand="cmdEdit_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
</asp:ImageButton>
</td>
<td><%# DataBinder.Eval(Container.DataItem, "ID")%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "ShortName"))%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "LongDescription"))%></td>
<td><%# DataBinder.Eval(Container.DataItem, "State")%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "AttributeProvider"))%></td>
<td>
<textarea id="Textarea1" rows="3" class="textbox" readonly="readonly" cols="20" style="width:400px;">
<%# DataBinder.Eval(Container.DataItem, "Content.Content")%>
</textarea>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr class="listitem2" onmouseover="this.className='over'" onmouseout="this.className='listitem2'">
<td class="cmdtd">
<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:HiddenField ID="templateID" runat="server" Value='<%# DataBinder.Eval(Container.DataItem, "ID")%>'/>
</td>
<td class="cmdtd">
<asp:ImageButton ID="cmdView" runat="server" ImageUrl="http://www.cnblogs.com/Skin/default/icon_view.gif" CausesValidation="False"
OnCommand="cmdView_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
</asp:ImageButton>
</td>
<td class="cmdtd">
<asp:ImageButton ID="cmdEdit" runat="server" ImageUrl="http://www.cnblogs.com/Skin/default/icon_edit.gif" CausesValidation="False"
OnCommand="cmdEdit_Click" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ID")%>'>
</asp:ImageButton>
</td>
<td><%# DataBinder.Eval(Container.DataItem, "ID")%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "ShortName"))%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "LongDescription"))%></td>
<td><%# DataBinder.Eval(Container.DataItem, "State")%></td>
<td><%# RenderUtil.FormatString(DataBinder.Eval(Container.DataItem, "AttributeProvider"))%></td>
<td>
<textarea id="Textarea1" rows="3" class="textbox" readonly="readonly" cols="20" style="width:400px;">
<%# DataBinder.Eval(Container.DataItem, "Content.Content")%>
</textarea>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater> CSS:
.list
{
border-right:solid 1px #888888;
border-top:solid 1px #888888;
}
tr.listheader td,th
{
border-left:solid 1px #BBBBBB;
border-bottom:solid 1px #BBBBBB;
background-color:#E6F6F6;
color:#444444;
white-space:nowrap;
padding:1px 1px 1px 1px;
font-weight:bold;
}
tr.listitem1 td
{
border-left:solid 1px #BBBBBB;
border-bottom:solid 1px #BBBBBB;
background-color:#FFFFFF;
padding:1px 1px 1px 1px;
text-indent:1px;
}
tr.listitem2 td
{
border-left:solid 1px #BBBBBB;
border-bottom:solid 1px #BBBBBB;
background-color:#F6F6F6;
padding:1px 1px 1px 1px;
text-indent:1px;
}
tr.over td
{
border-left:solid 1px #BBBBBB;
border-bottom:solid 1px #BBBBBB;
background-color:#FEE6BA;
padding:1px 1px 1px 1px;
text-indent:1px;
}
.cmdtd
{
text-align:center;
}
4
点击Repeater中的button，获取table中item的id，在连接的DataTable中删除数据
================================
在Repeater生成的table中，点击“删除”按钮，能够获取按钮所在的行的索引值，从而找到该行所对应的DataTable中的值，将其删除。更新DataTable！
===================================
1.Repeater生成table表，设置属性OnItemCommand ="Button2_Click"，调用按钮事件的处理过程
<asp:Repeater ID="Repeater1" runat="server" OnItemCommand ="Button2_Click" >
<HeaderTemplate >
<table border ="1" >
<tr>
<td >用户名称</td>
<td >用户年龄</td>
<td >用户密码</td>
<td >用户邮箱</td>
<td >用户性别</td>
<td >用户爱好</td>
<td >其他</td>
<td >照片</td>
</tr>
</HeaderTemplate>
<ItemTemplate >
<tr>
<td ><%#Eval("用户名称")%></td>
<td ><%#Eval("用户年龄")%></td>
<td ><%#Eval("用户密码")%></td>
<td ><asp:HyperLink ID="HyperLink1" NavigateUrl='<%#Eval("用户邮箱")%>' runat="server"><%#Eval("用户邮箱")%></asp:HyperLink></td>
<td ><%#Eval("用户性别")%></td>
<td ><%#Eval("用户爱好")%></td>
<td ><%#Eval("其他")%></td>
<td ><asp:HyperLink ID="HyperLink2" NavigateUrl='<%#Eval("照片")%>' runat="server"><%#Eval("照片")%></asp:HyperLink></td>
<td>
<asp:Button ID="Button2" runat="server" Text="删除" /></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate >
<tr style ="background-color : Aqua" >
<td ><%#Eval("用户名称")%></td>
<td ><%#Eval("用户年龄")%></td>
<td ><%#Eval("用户密码")%></td>
<td ><asp:HyperLink ID="HyperLink1" NavigateUrl='<%#Eval("用户邮箱")%>' runat="server"><%#Eval("用户邮箱")%></asp:HyperLink></td>
<td ><%#Eval("用户性别")%></td>
<td ><%#Eval("用户爱好")%></td>
<td ><%#Eval("其他")%></td>
<td ><asp:HyperLink ID="HyperLink2" NavigateUrl='<%#Eval("照片")%>' runat="server"><%#Eval("照片")%></asp:HyperLink></td>
<td>
<asp:Button ID="Button2" runat="server" Text="删除" /></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
2.定义事件
protected void Button2_Click(object sender, RepeaterCommandEventArgs e)
{
dt.Rows.Remove(dt.Rows[ e.Item .ItemIndex]);
Repeater1.DataSource = dt;
Repeater1.DataBind();
}
3.运行按钮“删除”，删除DataTable中的数据
