0

因此，我试图让 bootstrap 手风琴动态显示以获胜次数最多的前 5 名球队，我也将其用于其他排名。

问题是每当我单击选项卡 2、3 或 4 时，它只会在手风琴中打开选项卡 1。我知道问题出在“href='#collapse41'”在每个循环中都是相同的。我认为这将需要每个手风琴 div 选项卡的唯一 ID，但我不知道如何正确实现它。我可能是 100% 错的，如果是，请纠正我！

我已经对此进行了大约 15 次搜索，但只找到了一个答案，这不是很详细或很有帮助。任何帮助或学习如何做到这一点的指示将不胜感激。

（我将其重命名为 #collapse41 的原因是因为我在同一页面上有多个手风琴。）

<div class="accordion" id="accordion2">
<?php
include 'db.php'; //connect to database
$result = mysql_query("SELECT * FROM teams ORDER BY wins DESC LIMIT 5");
    $rank = 1;

    if (mysql_num_rows($result)) {
        while ($row = mysql_fetch_assoc($result)) {

echo "<div class='accordion-group'>";
echo "<div class='accordion-heading'>";
echo "<a class='accordion-toggle' data-toggle='collapse' data-parent='#accordion4' href='#collapse41'>";

    echo "<td>{$row['name']} <br /> </td>";

echo "</a>";
echo "</div>";
echo "<div id='collapse41' class='accordion-body collapse'>";
echo "<div class='accordion-inner'>";

    echo "<td>Rank: {$rank} <br /> </td>";
    echo "<td>Wins: {$row['wins']} <br /> </td>";
    echo "<td>Losses: {$row['losses']} <br /> </td>";

echo "</div>";
echo "</div>";
echo "</div>";

            $rank++;        
        }
    }
    ?>
</div>
4

1 回答 1

0

You have to break the loop up....and loop once to get headings, and twice to get body...

So you need to echo the group div first....

 echo "<div class='accordion-group'>";

Then start the loop to output headings... Then run another loop to output divs....

if (mysql_num_rows($result)) {
  //LOOP 1  
  while ($row = mysql_fetch_assoc($result)) {

  //Build heading pieces
  echo "<div class='accordion-heading'>";
  echo "<a class='accordion-toggle' data-toggle='collapse' data-parent='#accordion-".$row['id']." href='#accordian-".$row['id']."'>";

 echo "<td>{$row['name']} <br /> </td>";

 echo "</a>";
 echo "</div>";}

 //LOOP 2
 //Build inner pieces
 while ($row = mysql_fetch_assoc($result)) {

 echo "<div id='accordian-".$row['id']."' class='accordion-body collapse'>";
 echo "<div class='accordion-inner'>";

 echo "<td>Rank: {$rank} <br /> </td>";
 echo "<td>Wins: {$row['wins']} <br /> </td>";
 echo "<td>Losses: {$row['losses']} <br /> </td>";

 echo "</div>";
 echo "</div>";  }


echo "</div>";

        $rank++;        
    }
}

Im not actually too sure of how your accordian is to be structured, so this may or may not be correct information, but whenever I do twiiter-bootstrap accordians, this is how I do it. If you could post your expected HTML output (template for accordian), that would help me greatly, and I can revamp my answer to suit what you actually need

于 2013-06-18T19:47:56.530 回答