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

相关推荐
AI绘画哇哒哒6 小时前
【建议收藏!】35岁后端血泪忠告,这3类人别硬转Agent(过来人亲述)
java·人工智能·后端·ai·程序员·大模型·agent
唐青枫8 小时前
一个值多种形态:Zig union、Tagged Union 与内存布局实战
后端
卷无止境8 小时前
Windows 上丝滑开发 Python,并稳定构建 Docker 镜像
后端·python·docker
宝桥南山8 小时前
Blazor Web Assembly - 体验一下Authentication State从Server共享给Client
microsoft·微软·c#·asp.net·.net·.netcore
Nturmoils8 小时前
备份完不算完,先还原到临时库验一遍
后端
Csvn8 小时前
📊 SQL 入门 Day 22:视图与物化视图
后端·sql
Csvn9 小时前
🐍 Day 4: Python 控制流 — 条件、循环与推导式的艺术
后端·python
2601_953720829 小时前
【计算机毕业设计】基于Vue与Spring Boot的高校兼职信息服务平台设计与实现
spring boot·后端·课程设计
再吃一根胡萝卜10 小时前
用 Rust 写一个桌面悬浮图标:为什么它比 Python 更适合 AI 桌面工具?
后端
IT_陈寒11 小时前
Vue的computed属性把我坑惨了,原来我一直用错姿势
前端·人工智能·后端