无法发送 XMLHttpRequest

Question

I am trying to delete data with vanilla javascript ajax. After sending POST request with an id value to php file. Every time it prints "error" in the console.

HTML

<div class="deleteButton" onclick="showAllert(this)" id="1">
  <i class="fa-solid fa-trash-can fa-2x" style="color:#A81E22" title="delete"></i>
</div>

JAVASCRIPT

 <script>     
        function showAllert(a) {

            // sent delete request
            var dataId = a.getAttribute("id");
            var dataId = parseInt(dataId);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'includes/vehicles/del-veh.php', true);
            // xhr.responseType = 'json';
            xhr.onload = () => {
                if(xhr.status === 200) {
                    console.log(xhr.response);
                    location.reload();
                }else {
                    console.log("There was a problem");
                }
            }
            var data = JSON.stringify({id: dataId});
            xhr.send(data);
                    
        }
    </script>

PHP

<?php
//Connection statement
require_once('../../Connections/ukcd.php');
$data = json_decode(file_get_contents('php://input'), true);

if(!empty($data["id"])) {
    // Required variables
    $vehid = $data['id'];
    echo "success";
}else {
    echo "error";
}

//AUTOEXECUTE METHOD
$delveh = $ukcd->prepare('DELETE FROM a_ukcd_client_vehicles WHERE clientveh_id = ?');
$result = $ukcd->execute($delveh, $vehid);

Answer 1

Send POST data in urlencoded format:

 <script>     
        function showAllert(a) {

            // sent delete request
            var dataId = a.getAttribute("id");
            var dataId = parseInt(dataId);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'includes/vehicles/del-veh.php', true);
            // xhr.responseType = 'json';
            xhr.onload = () => {
                if(xhr.status === 200) {
                    console.log(xhr.response);
                    location.reload();
                }else {
                    console.log("There was a problem");
                }
            }
            // var data = JSON.stringify({id: dataId});
            xhr.send(`id=${dataId}`);
                    
        }
    </script>

And in your PHP script:

<?php
//Connection statement
require_once('../../Connections/ukcd.php');
$id= $_POST['id'];

if(!empty($id)) {
    // Required variables
    $vehid = $id;
    echo "success";
}else {
    echo "error";
}

//AUTOEXECUTE METHOD
$delveh = $ukcd->prepare('DELETE FROM a_ukcd_client_vehicles WHERE clientveh_id = ?');
$result = $ukcd->execute($delveh, $vehid);