Repeater与Table的配合使用

<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

<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">
                        &nbsp;&nbsp;<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

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>&nbsp;</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="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="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生成的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中的数据