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

相关推荐
晨非辰13 小时前
Makefile构建哲学:从依赖推导到自动化编译,掌握大型项目的构建逻辑,告别手动编译焦虑
linux·运维·服务器·c++·人工智能·后端·自动化
不能只会打代码13 小时前
基于Vue 3 + Spring Boot的物联网生鲜品储运系统设计与实现(源码附有详细的文档讲解)
java·前端·vue.js·spring boot·后端·物联网·github
BUG?不,是彩蛋!13 小时前
AI智慧社区--实现修改密码、退出登录、动态路由
java·spring boot·后端·intellij-idea·mybatis
smxgn13 小时前
【SpringBoot整合系列】SpringBoot3.x整合Swagger
java·spring boot·后端
BingoGo13 小时前
告别阻塞!用 PHP TrueAsync 实现 PHP 脚本提速 10 倍
后端·php
KD13 小时前
阿里云服务器迁移实战(一)——Mysql平滑迁移
后端
清汤饺子13 小时前
Cursor 独有的 12 个技巧:这些是 Claude Code 没有的
前端·后端·ai编程
周末程序猿13 小时前
技术总结|十分钟了解Git的Worktree
后端·ai编程
倾颜13 小时前
零成本本地大模型!用 Next.js + Ollama + Qwen3 打造流式聊天应用
前端·后端·ai编程
Victor35613 小时前
MongoDB(45) 嵌入式文档与引用的优缺点是什么?
后端