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

相关推荐
MC丶科6 小时前
【SpringBoot常见报错与解决方案】中文乱码?Spring Boot 统一解决前后端中文乱码问题(含 Postman 测试)!别再百度“加 UTF-8”了!
spring boot·后端·postman
XXOOXRT10 小时前
基于SpringBoot的加法计算器
java·spring boot·后端·html5
moxiaoran575311 小时前
Go语言的错误处理
开发语言·后端·golang
短剑重铸之日17 小时前
《7天学会Redis》特别篇: Redis分布式锁
java·redis·分布式·后端·缓存·redission·看门狗机制
小北方城市网17 小时前
SpringBoot 全局异常处理与接口规范实战:打造健壮可维护接口
java·spring boot·redis·后端·python·spring·缓存
hanqunfeng18 小时前
(三十三)Redisson 实战
java·spring boot·后端
小北方城市网18 小时前
SpringBoot 集成 MyBatis-Plus 实战(高效 CRUD 与复杂查询):简化数据库操作
java·数据库·人工智能·spring boot·后端·安全·mybatis
hanqunfeng20 小时前
(四十)SpringBoot 集成 Redis
spring boot·redis·后端
小北方城市网20 小时前
SpringBoot 集成 MinIO 实战(对象存储):实现高效文件管理
java·spring boot·redis·分布式·后端·python·缓存
程序员泠零澪回家种桔子20 小时前
RAG自查询:让AI精准检索的秘密武器
人工智能·后端·算法