已解决-使用删除按钮和复选框从数据库中删除值-语法错误，格式错误的JSON

Question

我正试图通过使用我存储在复选框中的ID来删除数据，该ID输入为value="quot；。。。这个想法是删除单个框/表，或者多个。。。是ID存储在输入中的方式有问题，还是删除功能完全错误，我不知道。。。

编辑：我设法通过在删除方法中所做的更改来解决这个问题，我在这次编辑中更正了这些更改。。。

我已经完全重做了delete.php部分，试图找出原因，现在我得到了这个有效载荷val%5B%5D=339，我收到了以下警报{"readyState":4,"responseText":"","status":200,"statusText":"OK"}

删除功能。。

$query = "DELETE FROM `$this->table` WHERE id = ?";
$stmt = $this->conn->prepare($query);
$rows_deleted = 0;
foreach ($ids as $id) {
$stmt->bindValue(1, $id, PDO::PARAM_INT);
$stmt->execute();
$rows_deleted += $stmt->rowCount();
}
return json_encode(['rows_deleted' => $rows_deleted]);

delete.php

header('Access-Control-Allow-Origin: *');
header('Content-Type: application/x-www-form-urlencoded');
header('Access-Control-Allow-Methods: DELETE');


include_once '../../config/database.php';
include_once '../../models/post.php';

//Instantiate db

$database = new Database();
$db = $database->connect();
$table = 'skandi';
$fields = [];
//Instantiate post
$product = new Post($db,$table,$fields);
$json = json_decode(file_get_contents("php://input"), true);

$product->id = $json['id'];

try {
$response = $product->delete($product->id);
echo $response;
} catch (Throwable $e) {
echo "Error occurred in delete method: " . $e->getMessage();
}

带有输入的表格。。。

async function renderUser() {
let users = await getUsers(); 
let html = ``;
users.forEach(user => {
let htmlSegment = `
<table class="box">
<tr> 
<th> <input type='checkbox' id='checkbox' name='checkbox[]' value=${user.id}> </th>                                           
<td>  ${user.sku}</td>
<td>  ${user.name}</td>
<td>  ${user.price}</td>
${user.size ? `<td> Size: ${user.size} $ </td>` : ""} 
${user.weight ? `<td> Weight: ${user.weight}  Kg</td>` : "" }
${user.height ? `<td>  Height: ${user.height} CM</td>` : ""}
${user.length ? `<td>  Length: ${user.length} CM</td>` : ""}
${user.width ? `<td>  Width: ${user.width} CM</td>` : ""}
</tr>
</table>`;
html += htmlSegment;
});
let container = document.querySelector('.message');
container.innerHTML = html;
}
renderUser();
};

AJAX删除请求

$(document).ready(function () {
$("#deleteBtn").click(function (e) {

let checkboxes = document.querySelectorAll("input[type=checkbox]:checked");
let ids = [];
for (let checkbox of checkboxes) {
ids.push(checkbox.value);
}
// Create the query string using the IDs array
// let queryString = '?' + ids.map((id) => `id=${id}`).join('&');
let data = {
id: ids,
};
$.ajax({
url: "/api/post/delete.php",
type: "DELETE",
data: JSON.stringify(data),
dataType: "json",
contentType: "application/json",
success: function (response) {
console.log(response);
},
error: function (error) {
console.log(error);
},
});
});
});

Answer 1

将header('Content-Type: application/json');更改为header('Content-Type: application/x-www-form-urlencoded');

对于删除请求，它需要声明application/x-www-form-urlencoded标头，因为HTML不支持DELETE方法，所以我们人为地使用它。

希望这将在未来帮助你和其他人：(

Answer 2

$.ajax({
type:'POST',
url:'delete.php',
data:{del_id:del_id},
success: function(data){
if(data=="YES"){
$ele.fadeOut().remove();
}else{
alert("can't delete the row")
}
}
})
})