ASP.NET - 如何在转发器中编写转发器

Posted 2023-03-31

【中文标题】ASP.NET - 如何在转发器中编写转发器

【英文标题】：ASP.NET - how to write a repeater inside a repeater

【发布时间】：2021-10-04 22:06:28

【问题描述】：

我在数据库中有两张表（老师和学生），每个老师都有一组学生。我在 ASP.NET 中制作了 html javascript 和 CSS 代码，使数字出现here，但我不知道如何放置一个中继器来提取教师姓名和另一个中继器用于教师学生姓名。除了如何在 C# 中编写该查询。

<div class="container">
    <div class="bs-example">
        <div class="accordion" id="accordionExample">
            <div class="card">
                <div class="card-header" id="headingOne">

                    <button type="button" class="btn btn-link" data-toggle="collapse" data-target="#collapseOne"> <i class="fa fa-plus pr-0"></i><span class="pl-0">teacher 1 <%--  i will replace to <%#  Eval("teacher_name")   %> --%></span></button>
                </div>
                <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
                    <div class="card-body">
                        <p>sturent 7</p>  <%--  i will replace to <%#  Eval("student_name")   %> --%>
                        <p>sturent 1 </p> <%--  i will replace to <%#  Eval("student_name")   %> --%>
                    </div>
                </div>
            </div>
            <div class="card">
                <div class="card-header" id="headingTwo">

                    <button type="button" class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo"><i class="fa fa-plus"></i> teacher 2</button>
                </div>
                <div id="collapseTwo" class="collapse show" aria-labelledby="headingTwo" data-parent="#accordionExample">
                    <div class="card-body">
                        <p>sturent 5 </p> <%--  i will replace to <%#  Eval("student_name")   %> --%>
                    </div>
                </div>
            </div>
            <div class="card">
                <div class="card-header" id="headingThree">

                    <button type="button" class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseThree"><i class="fa fa-plus"></i> teacher 3</button>
                </div>
                <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
                    <div class="card-body">
                        <p>sturent 1 </p> <%--  i will replace all of them to <%#  Eval("student_name")   %> --%>
                        <p>student 2 </p>
                        <p>sturent 3 </p>
                        <p>student 4 </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    $(document).ready(function () 
        // Add minus icon for collapse element which is open by default
        $(".collapse.show").each(function () 
            $(this).prev(".card-header").find(".fa").addClass("fa-minus").removeClass("fa-plus");
        );

        // Toggle plus minus icon on show hide of collapse element
        $(".collapse").on('show.bs.collapse', function () 
            $(this).prev(".card-header").find(".fa").removeClass("fa-plus").addClass("fa-minus");
        ).on('hide.bs.collapse', function () 
            $(this).prev(".card-header").find(".fa").removeClass("fa-minus").addClass("fa-plus");
        );
    );
</script>

【参考方案1】：

型号：

    public class Teacher
    
        public int Id  get; set; 
        public string Name  get; set; 
        public List<Student> Students  get; set; 
    

    public class Student
    
        public int Id  get; set; 
        public string Name  get; set; 
        public string Family  get; set; 
    

在你的行动中：

   public ActionResult Index()
        
            List<Teacher> teachers = new List<Teacher>();

            Teacher teacher1 = new Teacher();
            teacher1.Students = new List<Student>();
            teacher1.Students.Add(new Student  Name = "A", Family = "X" );
            teacher1.Students.Add(new Student  Name = "B", Family = "Y" );


            Teacher teacher2 = new Teacher();
            teacher2.Students = new List<Student>();
            teacher1.Students.Add(new Student  Name = "C", Family = "Z" );


            teachers.Add(teacher1);
            teachers.Add(teacher2);

            return View(teachers);
        

在你看来：

@model List<WebApplication2.Models.Teacher>

<div class="row">
    <div class="col-md-12">
        @foreach (var teacher in Model)
        
            <h2>@teacher.Name</h2>
            <table>
                @foreach (var student in teacher.Students)
                
                    <tr>
                        <td>@student.Name</td>
                        <td>@student.Family</td>
                    </tr>
                
            </table>
        
    </div>
</div>