Php 引导折叠和id

使用php、mysql和bootstrap。 php和mysql运行良好，但对于引导，如果我实际上是从

 while ($row = mysqli_fetch_array($result, MYSQL_ASSOC)){

我获取给定div中的所有行，但是如果我想使用引导折叠

<button data-toggle="collapse" data-target="#demo">More info</button>
<div id="demo" class="collapse">
    <div id="chart_div" style="width: 100%; height: 300px;"></div>
</div>

由于div的id将是相同的，因此如果有多行，则只有1行将折叠。即使我使用了模态，当点击按钮显示为模态时，只会显示第一个值

<?php
while ($row = mysqli_fetch_array($result, MYSQL_ASSOC)){?>

<div class="w3-container w3-card-2 w3-white w3-margin-bottom">
          <div class="w3-container">
          some stuff`
          <button data-toggle="collapse" data-target="#demo">More info</button>
         <div id="demo" class="collapse">`
             <div id="chart_div" style="width: 100%; height: 300px;"></div>
         </div>
        </div>
        </div>
<?php }?>

---

问题在于按钮“谢谢”

如果您需要每行的唯一ID，您可以这样做，例如：

<?php
$i = 0;
while ($row = mysqli_fetch_array($result, MYSQL_ASSOC)){
    $current_id = 'id-' . $i;
    $i++;?>

<div class="w3-container w3-card-2 w3-white w3-margin-bottom">
    <div class="w3-container">
    some stuff
    <button data-toggle="collapse" data-target="#<?=$current_id?>">More info</button>
    <div id="<?=$current_id?>" class="collapse">
        <div id="chart_div" style="width: 100%; height: 300px;"></div>
    </div>
    </div>
</div>
<?php }?>

在这种情况下，您将为输出的每个项目分配唯一的id—id-0、id-1、id-2等。

将数据添加到数据目标按钮属性和id折叠div属性，以使每个项目都不同

---

因此，请使用不同的id。如何做到这一点，php将为数据库中的每一行复制div，因此只有当您以这种方式编码时，它才会复制折叠id 3次。因此，编写代码以执行所需操作使用计数器或使用行中的一些数据。首先向我们显示while循环的内部，然后有人可能会建议解决方案。顺便说一句，很抱歉，打扰您了，如果我想交换使用唯一id的代码，那么在javascript的脚本标记中，既然它将是document.getelementbyid，我将如何定位它？谢谢你的时间，我不完全明白你的意思。你需要换身份证吗？您需要更改javascript吗？无论如何-用新的代码片段问另一个问题。如果我想为“”使用唯一的ID，我应该如何定位ID，var chart=new google.visualization.AreaChartdocument.getElementById'chart_div'；？

<div class="w3-container w3-card-2 w3-white w3-margin-bottom">
    <div class="w3-container">
          some stuff`
          <button data-toggle="collapse" data-target="#demo">More info</button>
         <div id="demo" class="collapse">`
             <div id="chart_div" style="">0</div>
         </div>
    </div>
</div>

<div class="w3-container w3-card-2 w3-white w3-margin-bottom">
    <div class="w3-container">
          some stuff`
          <button data-toggle="collapse" data-target="#demo1">More info</button>
         <div id="demo1" class="collapse">`
             <div id="chart_div" style="">1</div>
         </div>
    </div>
</div>

<div class="w3-container w3-card-2 w3-white w3-margin-bottom">
    <div class="w3-container">
          some stuff`
          <button data-toggle="collapse" data-target="#demo2">More info</button>
         <div id="demo2" class="collapse">`
             <div id="chart_div" style="">2</div>
         </div>
    </div>
</div>