Question

我有一个index.php，其中我有一个包含来自MySQL数据库的数据的表。表中的每一行都包含数据库中相应数据的数据。每行都有一个删除按钮。我想显示一个模态并请求删除该条目的权限。如果按下接受按钮，我想将该行的id传递给delete.php脚本，在该脚本中处理删除。那么我如何将我的表中的行的id传递给模态然后传递给我的delete.php。我知道我需要jquery和ajax，但我是一个初学者。我正在使用bootstrap。

这是我的按钮：

<a class="btn btn-danger" href="#delModal" data-toggle="modal 
               data-row-id="<?php echo $row['id'];?>" " >Delete</a>

和我的模态：

<div class="modal" id="deleteModal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
   <div class="modal-content">
     <div class="modal-header">
       <h5 class="modal-title">Delete Entry</h5>
       <button type="button" class="close" data-dismiss="modal" aria-label="Close">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>

  <input type="hidden" name="id" value=""/>
  <div class="modal-body">
    <p>Are you sure that you want to delete the selected Entry? There is no way to restore the deleted data!</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-success" id="accDelBtn">Yes, delete.</button>
    <button type="button" class="btn btn-danger" id="disMdBtn" data- 
 dismiss="modal">No, abort.</button>
  </div>
</div>

我的jquery / ajax垃圾尝试：

<script type="text/javascript">
$('#delBtn').on('click', function() {
$('#deleteModal').show();
});

$('#disMdBtn').on('click', function(){
    $('#deleteModal').hide();
});

 $('#accDelBtn').click(function() {

    $.ajax({
        type: "POST",
        url: "delete.php",
        data: { id: $row['id'] }
           })  
        });
</script>

感谢任何帮助！

Answer 1

您需要全局存储行的ID。在脚本开头添加变量：

var rowToDelete = null;

然后，当您单击删除按钮时，请在单击处理程序中更新它：

rowToDelete = ID_TO_DELETE;

最后，您可以将其传输为：

data: { id: rowToDelete }
           })  
        });

Answer 2

您已将名称属性为“id”的隐藏字段放置，您可以使用该字段执行进一步操作。

检查以下代码：

<script type="text/javascript">
    $('#delBtn').on('click', function() {
        $('#deleteModal').show();
        // setting value of hidden input field by using currently clicked link data-row-id attribute
        $('#deleteModal').find('input[name="id"]').val($(this).attr('data-row-id'));
    });

    $('#disMdBtn').on('click', function(){
        $('#deleteModal').hide();
    });

    $('#accDelBtn').click(function() {
        // retrieving value of hidden input field
        var id = $('#deleteModal').find('input[name="id"]').val();
        $.ajax({
            type: "POST",
            url: "delete.php",
            data: { id: id }
        });
    });
</script>

我刚设置隐藏字段的值，在锚标记点击。并在执行ajax调用时检索隐藏的字段值。

Answer 3

我为每个名为button的{{1}}标记添加了一个属性，并且记录ID应该存储在其中。

例如：

record_id

点击按钮（＆＃39; #delBtn＆＃39;）后，我获取ID并保存变量。

<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="delBtn" record_id="1">
                <span aria-hidden="true">&times;</span>
            </button>

当我点击按钮（＆＃39;＃accDelBtn＆＃39;）时，我会发送它。

将数据从HTML表传递到模态，然后传递到PHP脚本

3 个答案: