AJAX JQuery delete from html but not from mysql database

Question

What is wrong here?

My PHP/HTML (The only part that matters):

if(isset($_POST['submit']))
{
    $date = date('Y-m-d', strtotime(str_replace("-","/",$_POST['dateOfEntry'])));
    $username = $_POST['user'];

    $query = 'SELECT `ID`, `Date`, `Description`, `TypeOfDowntime`, `Machine#` FROM `machineissuesreport` WHERE `Date`="'.$date.'" AND `UpdatedBy` = "'.$username.'" ORDER BY `ID` DESC';

    $conn = mysqli_query($connection, $query);

    while($row = mysqli_fetch_array($conn))
    {
        echo '<tr>';
        echo '<td style="text-align: center" width="5px"><input type="button" name="edit" value="Edit"></td>';
        echo '<td style="text-align: center" width="5px"><a href="#" id="'.$row['ID'].'" class="delete">Delete</a></td>';
        echo '<td style="display: none;"><input type="hidden" value='.$row['ID'].'></td>';
        echo '<td>'.$row['Date'].'</td>';
        echo '<td>'.$row['Description'].'</td>';
        echo '<td>'.$row['TypeOfDowntime'].'</td>';
        echo '<td>'.$row['Machine#'].'</td>';
        echo '</tr>';
    }

}
?>

My Ajax/Javascript:

$(document).ready(function() 
{
    $('.delete').click(function()
    {
        if(confirm("Are you sure you want to delete this row?"))
        {
            var del_id = $(this).attr('id');
            var $ele = $(this).parent().parent();

            $.ajax({
                type: 'POST',
                url: 'machineEntryLogEdit.php',
                data: {'del_id':'del_id'},
                success: function(data)
                {
                    $ele.fadeOut().remove();            
                },
                error: function (xhr, status, error)
                {
                    alert(this);
                }
            });
        }
    });
});

My PHP (on an external script: machineEntryLogEdit.php):

include('connServer.php');

$deleteID = $_POST['del_id'];

$query = 'DELETE FROM `machineissuesreport` WHERE `ID` ="'.$deleteID.'"';

$result = mysqli_connect($connection, $query);

if(isset($result)) 
{
   echo "YES";
} 
else 
{
   echo "NO";
}

?>

I have searched around and around for solutions but no avail. The only things it does is delete the record from the HTML table, but not from the database, causing the supposed-to-be-deleted row to reappear after refresh. I am still very new to AJAX (in fact I just learned it myself today) and still reading the documentations and forums. Thanks.

Answer 1

This should be data: {'del_id': del_id} remove quotes so it react as a variable, not just a single string. And one more thing, your delete query does not execute cause you're using :

$result = mysqli_connect($connection, $query);

Should be mysqli_query like the one you did on selecting data's part:

$query = 'DELETE FROM `machineissuesreport` WHERE `ID` ="'.$deleteID.'"';
$result = mysqli_query($connection, $query);

Answer 2

It looks to me like you didn't pass the submit variable in your data. If you want to include a form you need to pass the data, right now the server is receiving only one parameter, del_id