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

相关推荐
struggleupwards1 分钟前
golang中defer的小坑
后端·go
hai99long2 分钟前
最终一致性分布式事务的解决方案
后端
独立开阀者_FwtCoder7 分钟前
国外最流行的 UI 组件库!适配 Vue、React、Angular!
前端·vue.js·后端
勇哥java实战分享10 分钟前
聊聊 RocketMQ 4.X 知识体系
后端
CodeSheep15 分钟前
小米汽车这薪资是认真的吗?
前端·后端·程序员
今天背单词了吗98018 分钟前
算法学习笔记:8.Bellman-Ford 算法——从原理到实战,涵盖 LeetCode 与考研 408 例题
java·开发语言·后端·算法·最短路径问题
天天摸鱼的java工程师20 分钟前
使用 Spring Boot 整合高德地图实现路线规划功能
java·后端
阿杆22 分钟前
😡同事查日志太慢,我现场教他一套 grep 组合拳!
linux·后端
PetterHillWater23 分钟前
基于Trae智能复杂项目重构实践
后端·aigc
凌览36 分钟前
有了 25k Star 的MediaCrawler爬虫库加持,三分钟搞定某红书、某音等平台爬取!
前端·后端·python