使用ajax调用删除图像文件

Question

I have a list of images, each with different id. When user clicks on the specific <img> follows by "Delete" button, I want to remove the that <img>and also remove the image file from the server. I have the following ajax call which will achieve this purpose.

$(document).ready(function () {

    $("img").click(function () {
        var img_id = $(this).attr("id");
        var imagefile = img_id;
        img_id = "#" + img_id;

        $("button").click(function () {          // delete button
            $("#image " + img_id).remove();
            $("button").unbind();

            $.ajax({
                type: "POST",
                url: "deleteimage.php",
                data: imagefile,                        
                success: function(response) {
                // do something
                }
        }); 
    });
});

I need to know the image id before I can delete the file. So I pass this into a variable then send it over to the following php file.

<?php
    include('config.php');

    if(isset($_POST['imagefile']))
    {
        $imagefile = $_POST['imagefile'];
        $imagepath = "Users/mp4_thumbnails-".$imagefile.".jpg"; 

        unlink($imagepath);
    }
?>

Sadly this is not working. This is my first try on ajax call. Any inputs will be greatly appreciated.

Answer 1

Try with this

$.ajax({
                type: "POST",
                url: "deleteimage.php",
                data: {"imagefile":imagefile},                        
                success: function(response) {
                // do something
                }
        });