动态ID不起作用的Bootstrap折叠面板

Question

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

当我检查其中一个面板时，它显示我＃5，它是来自数据库的ID之一。

但不幸的是这种方法是行不通的，我不知道为什么。有人可以看看它，并帮助我在良好的方向吗？这里是我的代码：

<?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 } ?> 

更新：

Answer 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++; } ?>