在页面上使用多个超链接的Bootstrap模式

Question

我使用bootstrap Modal打开弹出模式以设置我的帐户的权限。当我点击第一个链接时，它会准确打开。但是当我点击任何其他链接时。之前的数据再次显示。我已多次尝试但仍未成功。

以下是加载整个列表的Table for Table：

<table class="table table-bordered table-striped table-hover">
    <tr>
    <th>Code</th>
    <th>Name</th>
    <th>Authorities</th>
    <th>Password</th>
    <th>Status</th>
    </tr>
<?php
foreach($res as $data) {
    ?>
    <tr>
        <td><?php echo $data[INST_CODE]; ?></td>
        <td><?php echo $data[INST_NAME]; ?><?php echo "  ($insttype)"; ?></td>

        <td><a data-toggle="modal" data-target="#myModal" class="btn btn-info" href="auth2.php?inst_code=<?php echo $data[INST_CODE]; ?> ">Authorities</a></td>
    </tr>
<?php
}
?>
</table>

这是模态代码：

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Modal Header</h4>
            </div>
            <div class="modal-body">
                <p>Some text in the modal.</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

auth2.php包含要显示的内容。请指导我

Answer 1

在for循环中创建模态代码，并为每个元素提供动态ID <td><a data-toggle="modal" data-target="#myModal1" class="btn btn-info" >Authorities</a></td> <td><a data-toggle="modal" data-target="#myModal2" class="btn btn-info" >Authorities</a></td> 。 。 。 等

和模态代码将具有不同的id，每个都将在for循环中

Answer 2

将以下脚本放在模态调用按钮所在的页面中

<script>
//jQuery Library Comes First
//Bootstrap Library
$(document).ready(function() {
    $('#myModal').on('hidden.bs.modal', function () {
          $(this).removeData('bs.modal');
    });
});
</script>

关闭时会删除以前的数据，并在点击下一行模式按钮时打开模态时加载新数据。