Question

我有这个表格，其中包含 rfid mac tags 的数据。这些标签我想在弹出窗口中显示，并在按下时显示一些额外的信息。但它并没有像表本身那样改变它的价值。 popover似乎重复它给出的第一个值。如何在每次while循环后更改popover的值？

<div class="panel panel-default panel-success">
  <div class="panel-heading">
    <h3 class="panel-title">Items inside</h3>
  </div>

  <table class="table table-bordered  text-center">
    <?php
      $result = mysqli_query($con, "SELECT item_tag, item_status FROM item WHERE item_status = 1;") or die(mysql_error());

      $i = 0;
      while ($row = mysqli_fetch_array($result)){
        $i++;
        //if this is first value in row, create new row
        if ($i % 3 == 1) {
          echo "<tr>";
        }
      ?>

      <td>
        <div>
          <span class="btn" id="infoItem" data-toggle="popover"  rel="popover">
            <?php echo $row[0] ?>
          </span>
        </div>
      </td>

      <script>
        $(document).ready(function () {
          $('[data-toggle="popover"]').popover({
            html: true,
            animation: false,
            content: '<?php echo $row[0] ?>',
            placement: "bottom"
          });
        });
      </script>
      <?php
        //if this is third value in row, end row
        if ($i % 3 == 0) {
          echo "</tr>";
        }
      }
      //if the counter is not divisible by 3, we have an open row
      $spacercells = 3 - ($i % 3);
      if ($spacercells < 3) {
        for ($j = 1; $j <= $spacercells; $j++) {
          echo "<td></td>";
        }
        echo "</tr>";
      }
    ?>
  </table>

</div>

这是我第一次使用 html / php / mysql / bootstrap 应用程序。

Answer 1

如果我是你，我会利用bootstrap数据属性API。像

这样的东西

  <div class="panel panel-default panel-success">
  <div class="panel-heading">
    <h3 class="panel-title">Items inside</h3>
  </div>

  <table class="table table-bordered  text-center">

  <?php
  $result = mysqli_query($con, "SELECT item_tag, item_status FROM item WHERE item_status = 1;") or die(mysql_error());

  $i = 0;
  while ($row = mysqli_fetch_array($result)){
    $i++;
    //if this is first value in row, create new row
    if ($i % 3 == 1) {
      echo "<tr>";
    }
  ?>

      <td>
        <div>
          <span data-placement="bottom" data-content="<?php echo $row[0]; ?>" data-animation="false" data-html="true" class="btn" id="infoItem" data-toggle="popover"  rel="popover">
            <?php echo $row[0]; ?>
          </span>
        </div>
      </td>

  <?php
    //if this is third value in row, end row
    if ($i % 3 == 0) {
      echo "</tr>";
    }
  }

  </table>

</div>


<script type="text/javascript">

        $(document).ready(function () {
          //Init all the popovers with one call
          $('[data-toggle="popover"]').popover('show');

        });

</script>

Bootstrap Popover不会在循环

1 个答案: