asp.net repeater嵌套

OnItemCreated方式

html 复制代码
 <%-- 一级Repeater绑定班级信息 --%>
 <asp:Repeater ID="rptClassInfo" runat="server" OnItemCreated="rptClassInfo_ItemCreated">
     <ItemTemplate>
         <div class="classInfo">
             <h3><%# Eval("ClassName") %></h3>
             <div class="stuInfo">
                 <ul class="title">
                     <li>姓名</li>
                     <li>性别</li>
                     <li>年龄</li>
                 </ul>
                 <%-- 二级Repeater绑定学生信息 --%>
                 <asp:Repeater ID="rptStudentInfo" runat="server">
                     <ItemTemplate>
                         <ul class="<%# Container.ItemIndex%2==0?"cor1":"cor2" %>">
                             <%-- 根据单双行增加样式 --%>
                             <li><%# DataBinder.Eval(Container.DataItem,"Name") %></li>
                             <li><%# DataBinder.Eval(Container.DataItem,"Sex") %></li>
                             <li><%# DataBinder.Eval(Container.DataItem,"Age") %></li>
                         </ul>
                     </ItemTemplate>
                 </asp:Repeater>
             </div>
         </div>
     </ItemTemplate>
 </asp:Repeater>

后端代码

cs 复制代码
  protected void Page_Load(object sender, EventArgs e)
  {
      BindClassInfo();
  }

  /// <summary>
  /// 绑定学生信息(二级Repeater)
  /// </summary>
  /// <param name="sender"></param>
  /// <param name="e"></param>
  protected void rptClassInfo_ItemCreated(object sender, RepeaterItemEventArgs e)
  {

      if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
      {
          Repeater rptStudentInfo = e.Item.FindControl("rptStudentInfo") as Repeater;
          if (rptStudentInfo != null)
          {
              ClassInfo classInfo = e.Item.DataItem as ClassInfo;
              //如果是DataTable则DataItem是DataRowView
              /*
              	DataTable dt = new DataTable();
				dt.Columns.Add("id");
				for (int i = 0; i < 10; i++)
				{
				    var row = dt.NewRow();
				    row["id"] = i;
				    dt.Rows.Add(row);
				}
				
				var dataItem = e.Item.DataItem;
				var row = dataItem as DataRowView;
				Console.WriteLine(row["id"].ToString());
			  */
              if (classInfo != null && classInfo.StudentList != null)
              {
                  rptStudentInfo.DataSource = classInfo.StudentList;
                  rptStudentInfo.DataBind();
              }
          }
      }
  }

  /// <summary>
  /// 绑定班级信息(一级Repeater)
  /// </summary>
  public void BindClassInfo()
  {
      //获取所有班级信息
      List<ClassInfo> classInfoList = ClassInfo.GetClassInfoList();
      rptClassInfo.DataSource = classInfoList;
      rptClassInfo.DataBind();
  }

直接嵌套

html 复制代码
 <%-- 一级Repeater绑定班级信息 --%>
 <asp:Repeater ID="rptClassInfo" runat="server">
     <ItemTemplate>
         <div class="classInfo">
             <h3><%# Eval("ClassName") %></h3>
             <div class="stuInfo">
                 <ul class="title">
                     <li>姓名</li>
                     <li>性别</li>
                     <li>年龄</li>
                 </ul>
                 <%-- 二级Repeater绑定学生信息 --%>
                 <asp:Repeater ID="rptStudentInfo" runat="server" DataSource='<%#Eval("StudentList") %>'>
                     <ItemTemplate>
                         <ul class="<%# Container.ItemIndex%2==0?"cor1":"cor2" %>">
                             <%-- 根据单双行增加样式 --%>
                             <li><%# DataBinder.Eval(Container.DataItem,"Name") %></li>
                             <li><%# DataBinder.Eval(Container.DataItem,"Sex") %></li>
                             <li><%# DataBinder.Eval(Container.DataItem,"Age") %></li>
                         </ul>
                     </ItemTemplate>
                 </asp:Repeater>
             </div>
         </div>
     </ItemTemplate>
 </asp:Repeater>

后端代码

cs 复制代码
 protected void Page_Load(object sender, EventArgs e)
 {
     BindClassInfo();
 }

 /// <summary>
 /// 绑定班级信息(一级Repeater)
 /// </summary>
 public void BindClassInfo()
 {
     //获取所有班级信息
     List<ClassInfo> classInfoList = ClassInfo.GetClassInfoList();
     rptClassInfo.DataSource = classInfoList;
     rptClassInfo.DataBind();
 }

最终效果

方式1适合再次查找数据,比如再次查询数据库,方式2适合一次性查询出来直接绑定

字典和数组绑定

html 复制代码
<asp:Repeater ID="dicBindRpt" runat="server">
    <ItemTemplate>
        <p>
            <span><%#Eval("key") %></span>
            <span><%#Eval("value") %></span>
        </p>
    </ItemTemplate>
</asp:Repeater>
<hr />
<asp:Repeater ID="arrayBindRpt" runat="server">
    <ItemTemplate>
        <p>
            <%#Container.DataItem %>
        </p>
    </ItemTemplate>
</asp:Repeater>

后端代码

cs 复制代码
var dic = new Dictionary<string, string>();
dic.Add("Name", "Nick");
dic.Add("Age", "13");
this.dicBindRpt.DataSource = dic;
this.dicBindRpt.DataBind();

var array = new string[]
{
    "张三",
    "李四",
    "王五"
};
this.arrayBindRpt.DataSource = array;
this.arrayBindRpt.DataBind();

参考

https://blog.csdn.net/pan_junbiao/article/details/7462871

相关推荐
姑苏洛言4 小时前
编写产品需求文档:黄历日历小程序
前端·javascript·后端
姑苏洛言4 小时前
搭建一款结合传统黄历功能的日历小程序
前端·javascript·后端
你的人类朋友4 小时前
🍃认识一下boomi
后端
苏三说技术4 小时前
MySQL的三大日志
后端
豌豆花下猫4 小时前
让 Python 代码飙升330倍:从入门到精通的四种性能优化实践
后端·python·ai
南雨北斗5 小时前
TP6使用PHPMailer发送邮件
后端
你的人类朋友5 小时前
🤔什么时候用BFF架构?
前端·javascript·后端
争不过朝夕,又念着往昔7 小时前
Go语言反射机制详解
开发语言·后端·golang
绝无仅有8 小时前
企微审批对接错误与解决方案
后端·算法·架构
Super Rookie8 小时前
Spring Boot 企业项目技术选型
java·spring boot·后端