我如何动态地生成一个模态对话框链接点击与bootstrap/adminlte?

Question

我正在做一个小的PHP/HTML项目，这个项目让我定制了一个AdminLTE模板来用作web仪表板。

我想使用内置的引导模态对话框功能，并有它，所以当用户点击一个特定的链接，模态是动态生成的内容特定于该链接。

到目前为止，我已经能够得到模态功能的工作，但绝不是动态的，我不能把我的头围绕如何使它如此(我通常是一个开发在。net/powershell等，不玩这个东西太多，所以请原谅，如果我的术语不是很对点)

在我的页面内容中，我像这样生成链接(PHP查询MSSQL并构建HTML表)…

if ($numrows){
while( $row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC) ) {

echo '  <tr>';
echo '      <td>' . $row['did'] . '</td>';
echo '      <td><a data-toggle="modal" data-target="#modal-default">' . $row['hostname'] . '</a></td>';
//echo '<button type="button" class="btn btn-default" data-toggle="modal" data-target="#modal-default">';
echo '      <td>' . $row['os'] . '</td>';
echo '      <td><span class="badge bg-success">Online</span></td>';
echo '    </tr>';

}
}

当用户单击链接时，从#modal-default中激活模式，该模式当前在同一PHP页面上定义，如下所示…

<div class="modal fade" id="modal-default">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Default Modal</h4>
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<p>One fine body...</p>
</div>

</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->

所以我猜我需要有其他地方的链接点，也许是javascript或其他东西，将引用一个不同的PHP文件来检索特定于该链接的内容，然后动态构建模态。

谁能给我指出正确的方向来实现这个目标?

Answer 1

所以在玩了很多之后，我终于确定了这个，并想分享以防其他人遇到这个…

我修改了链接以包含一个类，像这样…

echo '<td><a class="loadmodalcontent" data-toggle="modal" data-target="#modal-default">' . $row['hostname'] . '</a></td>';

然后我将以下JS添加到…的底部

<script>
$('.loadmodalcontent').on('click',function(){
$('.modal-body').load('test.html',function(){
$('#modal-default').modal({show:true});
});
});
</script>

结果行为是加载模态，并将test.html的内容加载到modal-body中。