展開/摺疊僅適用於第一項

-1

我正試圖用展開/摺疊來創建手風琴/面板。所有來自模型的數據都被正確打印，我得到的唯一問題是第一項的摺疊/展開工作。我如何爲每件商品實施？展開/摺疊僅適用於第一項

我的代碼：

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> 
 

 
    <?php 
 
    $html_ret = ' 
 

 
    <div class="panel panel-default"> 
 
     <div class="panel-heading" role="tab" id="headingOne"> 
 
      <h4 class="panel-title"> 
 
       <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls=".collapse"> 
 
        <b>%s</b> (%s) 
 
       </a> 
 
      </h4> 
 
     </div> 
 
     <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> 
 
      <div class="panel-body"> 
 
       %s 
 
      </div> 
 
     </div> 
 
    </div>'; 
 

 
    foreach($arr_table_content as $row) 
 
    { 
 
     echo sprintf($html_ret, $row['TrainingName'],$row['TrType'],$row['Tr_description']); 
 
    } 
 
    ?> 
 

 
</div>

謝謝你的任何建議

來源

2017-06-14 user2678787

問題是你多次使用'collapseOne' id和其他id。你應該確保所有的id只使用一次。 –

將一個變量'$ i'放在id屬性中（記住初始化變量）。並在每個循環中增加'$ i'變量。 – Epodax

，因爲其餘的面板具有相同的ID作爲第一面板#collapseOne，儘量concatinate與ID的增量數，例如：

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> 

    <?php 
    $html_ret = ' 

    <div class="panel panel-default"> 
     <div class="panel-heading" role="tab" id="headingOne"> 
      <h4 class="panel-title"> 
       <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne%u" aria-expanded="false" aria-controls=".collapse"> 
        <b>%s</b> (%s) 
       </a> 
      </h4> 
     </div> 
     <div id="collapseOne%u" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> 
      <div class="panel-body"> 
       %s 
      </div> 
     </div> 
    </div>'; 

    $counter = 1; 
    foreach($arr_table_content as $row) 
    { 
     echo sprintf($html_ret,$counter,$row['TrainingName'],$row['TrType'],$counter,$row['Tr_description']); 
     $counter++; 
    } 
    ?> 

</div>

來源

2017-06-14 08:37:51 Mohammad

我相信你的問題來自於一個事實，即所有的面板標題具有相同id="headingOne"。嘗試在你的foreach循環動態ID（同樣的事情你panel-collapse）

來源

2017-06-14 08:33:10

回答

相關問題