如何使卡片引导程序崩溃以打开与每个卡片相关的内容？

Question

我有一个django项目，其中包含卡，其中每个卡都包含将隐藏或显示数据的折叠。

问题是，一旦我执行了 foreach循环，卡片就会出现，但折叠无效，并且不会显示任何数据。

我使用了以下步骤：

在views.py中创建函数

def displaydata(request,pk):
    c = cursor.execute('SELECT ID,Nickname_,Date_of_Birth FROM Person_ WHERE ID = pk ')
    print("c ===>",c)
    return redirect("search")
    return render(request,"displaydata.html",{"c":c})

在urls.py中创建URL

 path("displaydata/<int:pk>/",displaydata,name = "displaydata")

创建显示卡片的模板

  <div class="container">
        <div class="row justify-content-center">
            {% for obj in object_list %}

            <div class="col-xs-12 col-sm-6 col-md-6 col-lg-4 col-xl-3 mb-5">

                <div class="p-2 my-flex-item">
                    <div class="card innercardzoom">
                        <div class="inner">
                            <img src="{% static '/img/card/1.png'%}" class="card-img-top" alt="...">
                        </div>
                            <h5 class="card-header">
                            <a class="collapsed d-block" data-toggle="collapse" href="{% url 'displaydata' pk=obj.0 %}" aria-expanded="true" data-target = "#table-collapsed" caller-id ="" aria-controls="collapse-collapsed" id="heading-collapsed{{obj.0}">
                                    <i class="fa fa-chevron-down pull-right"></i>
                                     Details

                                <script type="text/javascript">

                                    $(document).on('click','.collapsed d-block',function(){
                                        $('#heading-collapsed').attr('caller-id',$(this).attr('id'));
                                    });
                                </script>


                                </a>

创建一个显示折叠数据

的模板

  {% for row in c %}
    <div id="table-collapsed" class="collapse" aria-labelledby="heading-collapsed">
        <table class="card-body table-sm table table-hover text-right">
            <tbody>
                <tr>
                    <td>NICKNAME</td>
                    <td>{{ row.1 }}</td>
                </tr> 
                <tr>
                    <td>DOB</td>
                    <td>{{ row.2 }}</td>
                </tr> 
            </tbody>
        </table>
    </div>

    {% endfor %}