使用 AJAX 从 MySQL 表中删除条目

Question

正如我在这里的另一个问题中所说，我正在创建一个登录类，但我正在为它做一些额外的选择。

其中之一是删除用户。我将向您展示我用来执行此操作的代码。

首先我列出所有使用此功能的用户：

public function listUsers() {
    $sql = "SELECT username FROM user";
    if($stmt = $this->conn->prepare($sql)) {
        $stmt->bind_result($usrn);
        $stmt->execute();

        while ($row = $stmt->fetch()) {
            $stmt->bind_result($usrn);
            echo    '<form name="delete-user" id="'.$usrn.'" class="delete-user" method="post" action="#">'.
                        '<fieldset class="user-wrapper">'.
                            '<label for="user" class="user-label">User</label>'.
                            '<input type="text" name="user" class="user" value="'.$usrn.'" autocomplete="off" readonly="readonly" />'.
                        '</fieldset>'.
                        '<fieldset class="delete-wrapper">'.
                            '<button type="submit" name="delete" class="delete">Delete</button>'.
                        '</fieldset>'.
                    '</form>';
        }
        $stmt->close();
        echo '<div class="message-handling"></div>';
    }
        else {
            $error = true;
            $message['error'] = true;
            $message['message'] = "The Users Could Not Be Listed";
            return json_encode($message);       
        }
}

如你所见，这个函数在 HTML 中的结果是这样的：

<form name="delete-user" id="altceva" class="delete-user" method="post" action="#"> 
    <fieldset class="user-wrapper">
        <label for="user" class="user-label">User</label>
        <input type="text" name="user" class="user" value="altceva" autocomplete="off" readonly="readonly" />
    </fieldset>
    <fieldset class="delete-wrapper">
        <button type="submit" name="delete" class="delete">Delete</button>
    </fieldset>
</form>

表单的 id 实际上是每个用户的名称（对于每个用户，都会使用用户的 id 创建一个表单）。输入的值也有用户名，因为我需要将它传递给另一个函数，以便我可以删除该用户。

接下来我尝试使用 AJAX 来删除我想要删除的用户。到目前为止我有这个功能：

var ids = $('.delete-user-content form[id]').map(function(){
    return this.id;
}).get();

jQuery.each(ids, function() {
    console.log("#" + this + ' .delete');

    $("#" + this + ' .delete').click(function() {

    $('.delete-user-content .message-handling').fadeOut();

    $.ajax({
        type: 'POST',
        url: 'assets/class/login/process.php',
        dataType: 'json',
        data: {
            delusername:    $('.delete-user input.user').val()
        },
        success:function(data) {
            if(data.error === true) {
                $('.delete-user-content .message-handling').text(data.message).fadeIn();
                console.log(data.message);
                setTimeout(function () {
                    $('.delete-user-content .message-handling').fadeOut();
                }, 15000);
            }
                else {
                    $('.delete-user-content .message-handling').text(data.message).fadeIn();
                    console.log(data.message);
                    $('#'+id).fadeOut();
                    array.splice(index, 1);
                    setTimeout(function () {
                        $('.delete-user-content .message-handling').fadeOut();
                    }, 15000);
                }
        },
        error:function(XMLHttpRequest,textStatus,errorThrown) {
            $('.delete-user-content .message-handling').text('Error | Check PHP log for information').fadeIn();
            console.log('Error | Check PHP log for information');
        }
    });
    return false;

});
});

而处理动作的PHP函数就是这个：

public function deleteUser($user) {
    $sql = "DELETE FROM user WHERE username = '$user'";
    if($stmt = $this->conn->prepare($sql)) {
        $stmt->execute();
        $stmt->close();
        $error = false;
        $message['error'] = false;
        $message['message'] = "The User ".$user." Has Been Deleted";
        return json_encode($message);
    }
        else {
            $error = true;
            $message['error'] = true;
            $message['message'] = "The User Could Not Be Deleted";
            return json_encode($message);       
        }
}

但问题是这不能正常工作。一个问题是，如果我删除最后一个列出的用户，它实际上会删除第一个用户。然后在我进行一次删除后，如果我单击另一个删除，则不会删除任何其他内容，它只会告诉我与第一次删除的用户相同。

现在，我知道这是很多代码，很难理解，但有人可以帮我解决吗？

Answer 1

您似乎正在使用一种非常复杂的方法来确定您的用户 ID。为什么不向表单添加一个隐藏字段并将事件处理程序附加到表单？这将消除对map 和each 的需求，从而加快处理过程中的一切。

所以你的形式会是这样的：

<form name="delete-user" class="delete-user" method="post" action="#"> 
  <input type="hidden" name="user_id" value="PHP_ECHO_USER_ID" />
  <fieldset class="user-wrapper">
  ...

您的 jquery 将被简化为：

$("form.delete_user").submit(function() {
  var user_id = $(this).find('[name="user_id"]').val();    // on the top of my head, untested...
  console.log(user_id);     // make sure you get the right user ID before doing anything else
  ...
  return false;
});