How do I use Ajax to run an SQL query within a php while loop?

Question

I have a table of Data which is pulled via SQL into DataTables. I want to use AJAX to run an SQL query which deleted the row based on $id = $row["id"]; .

Index.php:

$link = mysqli_connect("localhost", "bradlyspicer_root", "", "bradlyspicer_ResellerDB");

$id = $_POST['id'];
$deleterow = "DELETE FROM Offences WHERE id = ?";
    if($stmt = mysqli_prepare($link, $deleterow)){ // $link being your connection
        mysqli_stmt_bind_param($stmt, "s", $id);
        mysqli_stmt_execute($stmt);
        echo 'success';
        echo $id;
    } else {
        echo 'fail!';
        printf("Error: %s.\n", mysqli_stmt_error($stmt));
    }

Functions.php:

$id = $_POST['id'];
$deleterow = "DELETE FROM Offences WHERE id = ?";
    if($stmt = mysqli_prepare($link, $deleterow)){ // $link being your connection
        mysqli_stmt_bind_param($stmt, "s", $id);
        mysqli_stmt_execute($stmt);
        echo 'success';
    } else {
        echo 'fail!';
        printf("Error: %s.\n", mysqli_stmt_error($stmt));
    }

Custom.js:

$( ".delbtn" ).click(function(){
    var itemID = $(this).attr("itemID");
    console.log(itemID)
    $.ajax({
        url:"functions.php", //the page containing php script
        data: { id: itemID}, // itemID passed as id
        type: "POST", //request type
        success:function(result){
            alert(result);
        },
        error: function() {
            alert('Error occured');
        }
    });
});

I can't find where I pass the $id in the button from Index.php to Functions.php, any explanation would be appreciated.

Update: Since updating the script and trying to Debug, I'm not getting much of a response from the error which outputs:

fail!Error: .

Answer 1

Index.php:

Add a delete button identifier class delbtn and a data attribute that carries this row's id data-itemID

<?php
    while($row = mysqli_fetch_array($dataTablesResult)){
        $id = $row["id"];
        echo '
        <tr>
          <td>
            <button type="button" data-itemID="'.$id.'" class="delbtn btn btn-danger" >Remove</button>
          </td>
        </tr>
        ';
    }
?>

Functions.php:

Capture $_POST['id'] sent by ajax

$id = $_POST['id'];
$deleterow = "DELETE FROM Offences WHERE id = ?";
if($stmt = mysqli_prepare($link, $deleterow)){ // $link being your connection
    mysqli_stmt_bind_param($stmt, "s", $id);
    mysqli_stmt_execute($stmt);
}

Custom.js:

Run the jQuery function when a button with .delbtn class is clicked. Capture and store the row id from data attribute as $(this).data("itemID") . Then send the data using data: { id: itemID} within ajax request

$(".delbtn").click(function(){
    itemID = $(this).data("itemID");
    $.ajax({
        url:"functions.php", //the page containing php script
        data: { id: itemID}, // itemID passed as id
        type: "POST", //request type
        success:function(result){
            alert(result);
        }
    });
});

Answer 2

i think if you change this line :

mysqli_stmt_bind_param($stmt, "s", $id);

to this is one:

mysqli_stmt_bind_param($stmt, "i", $id);

it may works