Question

I have a jquery delete statement and it’s only deleting the NEWEST upload on my files (using mysql) Say I had “file uploaded first”, “file uploaded second”, “file uploaded last(newest file)”. If I click “file uploaded first or second”, it deletes the newest (file uploaded third).

    $(document).on('click', '.del', function(){
    var sid = $(this).next('.hiddenVid').val();
    $.ajax({
        type: "GET",
        url: "delete.php",
        data: {id:sid}
    });
    return false;
});

Answer 1

this is your error ->

var sid = "$vid";. 

It will only produce the ID for the latest item that you put in.

Add an item to your echo statement so you can reference it later in the click function.

Add a reference to the vid in a hidden input.

Change this

$option = "<td><form method='POST'><button type='submit' name='del' class='del'><i class='icon-remove'></i></button></form></td>";

To this:

$option = "<td><form method='POST'><button type='submit' name='del' class='del'><i class='icon-remove'></i></button><input type='hidden' class='hiddenVid' value='".$vid."'/></td>";

Change your click function to reference the real sid now.

$(function(){
    $(".del").click(function(){
        var row = $(this).parent();
        var sid = $(this).next('.hiddenVid').val();
        alert(sid);
        $.ajax({
            type: "GET",
            url: "delete.php",
            data: {id:sid}
        });
        return false;
    });
 });

If you want to return the rows after the update, you’ll need to spit the data back to be printed, based on the above method you use to retrieve the rows and return them, you could reuse it.

$id = mysql_real_escape_string($_REQUEST['id']);
$DB->Query("DELETE FROM `files` WHERE `id`='$id'");

if(TRUE == (unlink("uploads/$id")):
    $DB->Query("SELECT * FROM `files` WHERE `author`='$username'");
    $file = $DB->Get();
    $obj = new stdClass();
    $i = 0;
    foreach($file as $key => $value){
        $n = $value['name'];
        $vid = $value['id'];
        $date = "<td>".$value['date']."</td>";
        $fname = "<td><a id='$vid' href='download.php?id=$vid'>$n</a></td>";
        $option = "<td><form method='POST'><button type='submit' name='del' class='del'><i class='icon-remove'></i></button></form></td>";
        $size = "<td>".filesize("uploads/".$vid."/".$value['name'])." bytes</td>";
        $obj->$i = $files = "<tr>".$fname.$size.$date.$option."</tr>";
        $i++;
    }
    echo json_encode($obj);
endif;

Now we need to change the click handler to expect a dataType and replace the existing data in the table.

$(function(){
    $(".del").click(function(){
        var row = $(this).parent();
        var sid = $(this).next('.hiddenVid').val();
        alert(sid);
        $.ajax({
            type: "GET",
            url: "delete.php",
            dataType: 'json',
            data: {id:sid},
            success: function(data){
              $('table').empty();
              $.each(data, function(i,obj){
                  $('table').append(obj);
              }
            }
        });
        return false;
    });
 });