php - Bootstrap - 模态仅显示第一项

Question

我正在使用 Bootstrap 来设计这个网页。此页面包含一个表格，我在其中使用 modal 显示有关所选项目的更多详细信息。

我的问题是表格上的所有按钮仅重定向到第一项的第一个详细信息。我正在考虑 id 名称并将其放入数组中，但它不起作用(或者我做错了)。

下面是一个示例代码，可以为您提供一个想法:

<?php
(loop){

$itemtopic=$loop['item'];
$data=$loop['data'];

?>

<button class="btn btn-primary" data-toggle="modal" data-target="#myModal" style="float:right; margin-left:5px;" title="New User"><?php echo $itemtopic; ?></button>

            <!-- Modal -->
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
              <div class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="myModalLabel">Create New User</h4>
                  </div>
                  <div class="modal-body">
                    <?php echo $data; ?>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                  </div>
                </div>
              </div>
            </div>

<?php
} /* END OF LOOP */
?>

如何显示所选项目的相应数据，而不仅仅是第一个项目的第一个详细信息？

Answer 1

@Logon Wayne，对于您是否正在这样做有点模糊，所以您能否确认您是否正在使用 X 模态打印 X 按钮，并且它们为每对都有匹配的唯一 ID？

例如:

<?php
$rows = array('1'=>"afasdf",'2'=>"fagagadfg"); 

foreach($rows as $key=>$data):
?>
<button class="btn btn-primary" data-toggle="modal" data-target="#myModal<?php echo $key;?>" style="float:right; margin-left:5px;" title="New User">Create New User</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">Create New User</h4>
      </div>
      <div class="modal-body">
        <?php echo $data; ?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<?php 
endforeach;
?>

关键是唯一的 ID，否则它当然会找到并显示第一个模态标题#myModal。

如果你使用ajax来替换每次加载的内容，你只能使用1个模态，这不是你正在做的事情，而且似乎也不需要，除非你由于这个循环而真正有大量的html打印，在这种情况下分页无论如何，这将是合乎逻辑的下一步。

:)