动态ID无效的Bootstrap折叠面板

时间:2017-03-28 08:47:20

标签: php twitter-bootstrap dynamic panel

我有一个带有面板的页面,这些面板是用PHP动态制作的。每个项目都有一个新面板。但是当我想打开其中一个面板时,只打开了第一个面板。所以我从数据库中检索ID,并希望将其用作我的面板的ID。

当我检查其中一个面板时,它会显示#5,这是数据库中的一个ID。

enter image description here

但不幸的是,这种方式不起作用,我不知道为什么。有人可以看看它并帮助我朝着好的方向前进吗?这是我的代码:

<?php

$sql = "SELECT * FROM project";
$result = mysqli_query($db,$sql);
while($row = mysqli_fetch_array($result)){
    $id = $row['id'];
    $panelid = "#$id";?>
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="faqhead">
            <h4 class="panel-title">
                <?php
                echo '<a role="button" data-toggle="collapse" data-parent="#accordion" href="'. $panelid .'" aria-expanded="false" aria-controls="collapseOne">';
                echo $row['projectname'];
                echo '</a>';
                ?>
            </h4>
        </div>
        <?php echo '<div id="'. $panelid.'" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">'; ?>
            <div class="panel-body" id="faqpanel">
                <h1 class="">Taken
                    <small>
                        <a role="button" data-toggle="modal" data-target="#newtask"><span class="glyphicon glyphicon-plus project" style="color:#000;"></span></a>
                    </small>
                </h1>
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th style="width: 5%;"></th>
                        <th style="width: 5%;">Taak ID</th>
                        <th style="width: 10%;">Taak naam</th>
                        <th style="width: 20%;">Omschrijving</th>
                        <th style="width: 10%;">Start datum</th>
                        <th style="width: 10%;">Einddatum</th>
                        <th style="width: 30%;">Notities</th>
                        <th style="width: 10%">Duur</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<?php } ?>  

更新:Print all the ID's

1 个答案:

答案 0 :(得分:1)

不要只使用id的数字这不起作用。使用一些文本和concat id,例如colapse_1,colapse_2

<?php

$i = 1;
while($i < 5){
    $id = $i;
    ?>
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
    <div class="panel panel-default">
        <div class="panel-heading" role="tab" id="faqhead">
            <h4 class="panel-title">
                <?php
                echo '<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse_'. $id .'" aria-expanded="false" aria-controls="collapseOne">';
                echo $id;
                echo '</a>';
                ?>
            </h4>
        </div>
        <?php echo '<div id="collapse_'. $id.'" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">'; ?>
            <div class="panel-body" id="faqpanel">
                <h1 class="">Taken
                    <small>
                        <a role="button" data-toggle="modal" data-target="#newtask"><span class="glyphicon glyphicon-plus project" style="color:#000;"></span></a>
                    </small>
                </h1>
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th style="width: 5%;"></th>
                        <th style="width: 5%;">Taak ID</th>
                        <th style="width: 10%;">Taak naam</th>
                        <th style="width: 20%;">Omschrijving</th>
                        <th style="width: 10%;">Start datum</th>
                        <th style="width: 10%;">Einddatum</th>
                        <th style="width: 30%;">Notities</th>
                        <th style="width: 10%">Duur</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<?php $i++; } ?>