Javascript 如何动态更改模态内容?
我有一个数据库列表网页,在那里我列出了关于数据库中东西的各种信息。我还有一个模态,它显示了与其内容相关的链接 从图中可以看到,我有一个模型,每个模型体都包含一个类似“/upload/something.pdf”的链接,因此当我单击模型时,它会直接显示文档。现在我需要它来显示多个文件。每个链接都有自己的数据库条目,但我不知道如何在每次按下模式底部的数字按钮时进行模式更改。我想按1-2-3,它会根据存储在数据库中的链接更改内容 这是我的HTML代码Javascript 如何动态更改模态内容?,javascript,php,html,Javascript,Php,Html,我有一个数据库列表网页,在那里我列出了关于数据库中东西的各种信息。我还有一个模态,它显示了与其内容相关的链接 从图中可以看到,我有一个模型,每个模型体都包含一个类似“/upload/something.pdf”的链接,因此当我单击模型时,它会直接显示文档。现在我需要它来显示多个文件。每个链接都有自己的数据库条目,但我不知道如何在每次按下模式底部的数字按钮时进行模式更改。我想按1-2-3,它会根据存储在数据库中的链接更改内容 这是我的HTML代码 </div> <di
</div>
<div class="container">
<table class="table table-bordered">
<thead class="thead-dark">
<tr class="bg-primary text-white">
<th>ID</th>
<th>Description</th>
<th>Location</th>
<th>Cost</th>
<th>Date</th>
<th>Category</th>
<th>File</th>
<th class="text-center">Action</th>
</tr>
</thead>
<tbody id="dtBasicExample">
<?php
if(count($userData)>0){
$s = '';
foreach($userData as $val){
$s++;
if( $val['currency'] == "TL"){
$total= $total+ $val['cost'];
}
if( $val['currency'] == "$"){
$total_usd=$total_usd+ $val['cost'];
}
?>
<?php
$slash = "/";
$date = $val['day'] .$slash .$val['month'] .$slash .$val['year'] ;
$link = "uploads" .$slash . $val['file'];
?>
<tr>
<td><?php echo $val['id'];?></td>
<td><?php echo $val['description'];?></td>
<td><?php echo $val['location'];?></td>
<td><?php echo $val['cost'];if ($val['currency'] == "TL"){echo "₺";} else { echo $val['currency'];}?></td>
<td><?php echo $val['datee'];?></td>
<td><?php echo $val['type'];?></td>
<td><?php
if ($val['file']!= NULL){
echo
'<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#MyModal_' . $val['id'] . '">
Details
</button>';
}
else {
echo '<button type="button" class="btn btn-primary " disabled>Details</button>';
}
?>
</td>
<div id="MyModal_<?php echo $val['id']?>" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg" style="max-width: 90%;" role="document">
<div class="modal-content">
<div class="modal-header">
<div class="modal-title"><h3>Preview </h3></div>
</div>
<div class="modal-body">
<embed src="<?php echo $link?>" width="850" height="720" />
</div>
<div class="modal-footer">
<form method="post" action="admin_view">
</form>
<button type="button" id ="one" class="btn btn-default" >1</button>
<button type="button" id="two" class="btn btn-default" >2</button>
<button type="button" id="three" class="btn btn-default" >3</button>
<button type="button" class="btn btn-default" >Download</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</td>
<!-- <td id="a1"><a target="_blank" rel="noopener noreferrer" href="<?php echo $link?>" class="text-primary"> Click</a>-->
<td align="center">
<a href="edit-cost.php?editId=<?php echo $val['id'];?>" class="text-primary"><i class="fa fa-fw fa-edit"></i> Edit</a> |
<a href="delete.php?delcostId=<?php echo $val['id'];?>" class="text-danger" onClick="return confirm('Are you sure to delete this record?');"><i class="fa fa-fw fa-trash"></i> Delete</a> |
</td>
</tr>
<?php
}
}else{
?>
<tr><td colspan="8" align="center">No Record(s) Found!</td></tr>
<?php }
?>
</tbody>
</table>
<p style="text-align: left;"><?php echo "Total ₺="; echo $total; ?></p>
<p style="text-align: left;"><?php echo "Total $="; echo $total_usd; ?></p>
</div> <!--/.col-sm-12-->
</div>
``
身份证件
描述
位置
成本
日期
类别
文件
行动
将onclick事件添加到1/2/3按钮中,这些按钮使用ajax获取数据并像系统一样显示数据?