在我的网站上,单击该按钮时,它将提示一个弹出窗口。我正在使用模式弹出窗口。我的问题是,我无法根据按钮的ID获取正确的数据。下面是我的代码:html表:
<tbody> <?php $counter = 1; $data = "SELECT * FROM family"; $result = $conn->query($data); while($ser=mysqli_fetch_array($result)) { ?> <tr> <td><center><?php echo $counter; $counter++; ?></center></td> <td><center><?php echo $ser['fam_id'];?></center></td> <td><center><?php echo $ser['fam_name']; ?></center></td> <td><center><button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal" data-id=<?php echo $ser['fam_id'];?>>Edit Attendance Status</button></center>
的fam_id是主键。
fam_id
然后,下面是模式弹出窗口的代码
<!-- Modal --> <form id="form1" method="post"> <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">×</span><span class="sr-only">Close</span></button> <h4 class="modal-title" id="fam_id">Name <?php echo $ser['fam_name'];?></h4> </div> <div class="modal-body"> <b>Details</b> <hr></hr> Address: <?php echo $ser['fam_add']; ?><p></p> Phone_num: <?php echo $ser['fam_phone']; ?><p></p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> </form>
而且,我将它们放在一个文件中。总而言之,如下所示:
<tbody> <?php $counter = 1; $data = "SELECT * FROM family"; $result = $conn->query($data); while($ser=mysqli_fetch_array($result)) { ?> <tr> <td><center><?php echo $counter; $counter++; ?></center></td> <td><center><?php echo $ser['fam_id'];?></center></td> <td><center><?php echo $ser['fam_name']; ?></center></td> <td><center><button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal" data-id=<?php echo $ser['fam_id'];?>>Edit Attendance Status</button></center> <!-- Modal --> <form id="form1" method="post"> <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">×</span><span class="sr-only">Close</span></button> <h4 class="modal-title" id="fam_id">Name <?php echo $ser['fam_name'];?></h4> </div> <div class="modal-body"> <b>Details</b> <hr></hr> Address: <?php echo $ser['fam_add']; ?><p></p> Phone_num: <?php echo $ser['fam_phone']; ?><p></p> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> </form> </td> </tr> <?php } ?> </tbody>
<tbody> <?php $counter = 1; $data = "SELECT * FROM family"; $result = $conn->query($data); while($ser=mysqli_fetch_array($result)) { ?> <tr> <td><center><?php echo $counter; $counter++; ?></center></td> <td><center><?php echo $ser['fam_id'];?></center></td> <td><center><?php echo $ser['fam_name']; ?></center></td> <td> <center> <a class="modalLink" href="#myModal" data-toggle="modal" data-target="#myModal" data-id="<?php echo $ser["fam_id"]; ?>" data-addr="<?php echo $ser['fam_add']; ?>" data-phone="<?php echo $ser['fam_phone']; ?>" data-name="<?php echo $ser['fam_name']; ?>"> <button class="btn btn-primary btn-sm"> Edit Attendance Status </button> </a> </center>
将此代码放在 footer.php 或此页面末尾。
<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> </div> </div>
通过ajax调用您的“ somepage.php”(单独的页面。将此放置<script></script>在您的 JS 文件中。
<script></script>
<script> $('.modalLink').click(function(){ var famID=$(this).attr('data-id'); var famAddr=$(this).attr('data-addr'); var famPhone=$(this).attr('data-phone'); var famName=$(this).attr('data-name'); $.ajax({url:"somepage.php?famID="+famID+"&famAddr="+famAddr+"&famPhone="+famPhone+"&famName="+famName,cache:false,success:function(result){ $(".modal-content").html(result); }}); }); </script>
somepage.php 创建somepage.php(如果您想更改此页面名称。也进行更改<script></script>。两者都相关。)
<? $famID=$_GET['famID']; $famAddr=$_GET['famAddr']; $famPhone=$_GET['famPhone']; $famName=$_GET['famName']; ?> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> <h4 class="modal-title" id="fam_id">Name <?php echo $famName;?></h4> </div> <div class="modal-body"> <form id="form1" method="post"> <b>Details</b> <hr></hr> Address: <p><?php echo $famAddr;?></p> Phone_num: <p><?php echo $famPhone;?></p> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div>