Question

我有一个从php while循环生成的表，在一个名为 userlist.php 的文件中显示记录。使用data-id，每个表现在都有与之关联的SQL记录ID。

在我的 container.php 文件中，我有我的初始jQuery代码，它以1秒的间隔将 userlist.php 加载到div中。现在，当单击每个单独的表时，我隐藏 userlist.php 并在名为 userdetails.php 的div中显示另一个文件，其中包含有关每个用户的更多信息。

现在，我正在尝试使用jQuery对话框窗口在删除记录之前显示确认消息。在 userdetails.php 中，您可以看到我根据一些建议修改过的ajax代码段。问题是将其插入到文件中可以防止每个表都被单击以显示详细信息。如果我删除它，可以访问详细信息。

这是我没有ajax代码段的代码，包括它不允许访问详细信息： Click Here

container.php

<div id="userlist"></div>

<div id="userdetails"></div>

<script>
setInterval(function(){
   $("#userlist").load("userlist.php");
}, 1000);
$('#userdetails').hide();
$(document).on("click",".user", function() {
    var id = $(this).attr("data-id");
      $.get("userdetails.php", {id: id}).done(function(data) {
      $('#userdetails').html(data);
      $('#userdetails').show();
      $('#userlist').hide();
  });
})
$(document).on("click","#back", function() {
  $('#userlist').show();
  $('#userdetails').hide();
});
 </script>

userlist.php

<?php

include 'dbh.php';

$result = $conn->query("SELECT * FROM users");

if ($result->num_rows > 0) {

  while ($row = $result->fetch_assoc()) {

    $color = array("ADMIN"=>"#ebc45b", "MOD"=>"#8fce61", "USER"=>"#9b9ed2");

?>

      <table data-id="<?php echo $row['id']; ?>" class="user" title="User ID: <?php echo $row['id']; ?>">
        <tr>
          <td align="left">User ID:</td>
          <td align="right"><?php echo $row['id']; ?></td>
        </tr>
        <tr>
          <td align="left"><?php echo $row['address']; ?></td>
          <td align="right"><?php echo $row['zip']; ?></td>
        </tr>
        <tr>
          <td align="left"><?php echo $row['city']; ?></td>
          <td align="right"><?php echo $row['state']; ?></td>
        </tr>
        <tr>
          <td align="left"><span style="color: <?php echo $color[$row['user_level']]; ?>"><?php echo $row['user_level']; ?></span></td>
          <td align="right">"member since..."</td>
        </tr>
      </table>

<?php
  }
}
?>

userdetails.php

<?php

include 'dbh.php';

$result = $conn->query("SELECT * FROM users WHERE id=" . $_GET["id"]);

if ($result->num_rows > 0) {

  while ($row = $result->fetch_assoc()) {

?>
<div class="menu">
<span id="back">BACK</span>
<span id="delete" data-id="<?php echo $row['id']; ?>">DELETE</span>
<span id="new">NEW</span>
<span id="edit">EDIT</span>
</div>
<table class="userdetails">
<tr>
  <td align="left">First Name:</td>
  <td align="right"><?php echo $row['first_name']; ?></td>
</tr>
<tr>
  <td align="left">Last Name:</td>
  <td align="right"><?php echo $row['last_name']; ?></td>
</tr>
<tr>
  <td align="left">Age:</td>
  <td align="right"><?php echo $row['age']; ?></td>
<tr>
</tr>
  <td align="left">Sex:</td>
  <td align="right"><?php echo $row['sex']; ?></td>
</tr>
</table>

<script>

//JQ Delete
$(document).on("click","#delete", function() {
  var id = $(this).attr('data-id');
  $("#dialog-confirm").data('del-id', id).dialog('open').html('Delete user ' + id + '?');
});

$("#dialog-confirm").dialog({
  resizable: false,
  title: 'Confirm Delete',
  height:150,
  modal: true,
  autoOpen:false,
  buttons: {
    'Yes': function() {
      var id = $(this).data('del-id');

      $.ajax({
        type:'POST',
        url:'deleteuser.php',
        data:{id: id},
      }),


    $('#append').append('Deleted User: ' + id + '<br>');
      $(this).dialog('close');
    },
    'No': function() {
      $(this).dialog('close');
    }
  }
});

</script>

 <div id="dialog-confirm" style="display:none;"></div>

 <span id="append"></span>

<?php
 }
}
?>

deleteuser.php

<?php
include 'dbh.php';
$sql = "DELETE FROM users WHERE id=" . $_POST["id"];

if ($conn->query($sql) === TRUE) {
    echo "User has been deleted!!!";
} else {
    echo "Error deleting user: " . $conn->error;
}
$conn->close();

只是寻求一些帮助，谢谢！

Answer 1

最后得到了这个：

  $.ajax({
    type:'POST',
    url:'deleteuser.php',
    data:{id: id},
  }),

Answer 2

我认为这就是你想要的：

 $.ajax({
    url: "deleteuser.php",
    type: "post",
    data: 'deleteuser.php?id=' + id,
    cache: false,
    success: function(data) {
      // Close your dialogue on success
    }
  });

希望这有帮助！

从jQuery对话框中删除SQL记录

2 个答案: