Home/ Questions/Q 8727321
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T08:24:54+00:00

Got a little situation here where I am trying to cancel a file’s upload.

  • 0

Got a little situation here where I am trying to cancel a file’s upload. What I have done is stated that if the user clicks on the “Cancel” button, then it will simply remove the iframe so that it does not go to the page where it uploads the files into the server and inserts data into the database.

Now this works fine if the user clicks on the “Cancel” button in quickish time the problem I have realised though is that if the user clicks on the “Cancel” button very late, it sometimes doesn’t remove the iframe in time meaning that the file has just been uploaded just before the user has clicked on the “Cancel” button.

So my question is that is there a way that if the file does somehow get uploaded before the user clicks on the “Cancel” button, that it deletes the data in the database and removes the file from the server?

Below is the image upload form:

<form action="imageupload.php" method="post" enctype="multipart/form-data" target="upload_target_image" onsubmit="return imageClickHandler(this);" class="imageuploadform" >
  <p class="imagef1_upload_process" align="center">
    Loading...<br/>
    <img src="Images/loader.gif" />
  </p>
  <p class="imagef1_upload_form" align="center">
    <br/>
    <span class="imagemsg"></span>
    <label>Image File: <input name="fileImage" type="file" class="fileImage" /></label><br/>
    <br/>
    <label class="imagelbl"><input type="submit" name="submitImageBtn" class="sbtnimage" value="Upload" /></label>
  </p>
  <p class="imagef1_cancel" align="center">
    <input type="reset" name="imageCancel" class="imageCancel" value="Cancel" />
  </p>
  <iframe class="upload_target_image" name="upload_target_image" src="#" style="width:0px;height:0px;border:0px;solid;#fff;"></iframe>
</form>

Below is the jquery function which controls the “Cancel” button:

$(imageuploadform).find(".imageCancel").on("click", function(event) {
    $('.upload_target_image').get(0).contentwindow
    $("iframe[name='upload_target_image']").attr("src", "javascript:'<html></html>'");
    return stopImageUpload(2);
});

Below is the php code where it uploads the files and inserts the data into the database. The form above posts to this php page “imageupload.php”:

<body>
<?php

include('connect.php');

session_start();

$result = 0;


//uploads file
move_uploaded_file($_FILES["fileImage"]["tmp_name"],
"ImageFiles/" . $_FILES["fileImage"]["name"]);
$result = 1;

//set up the INSERT SQL query command to insert the name of the image file into the "Image" Table
$imagesql = "INSERT INTO Image (ImageFile) 
VALUES (?)";

//prepare the above SQL statement
if (!$insert = $mysqli->prepare($imagesql)) {
  // Handle errors with prepare operation here
}

//bind the parameters (these are the values that will be inserted) 
$insert->bind_param("s",$img);

//Assign the variable of the name of the file uploaded
$img = 'ImageFiles/'.$_FILES['fileImage']['name'];

//execute INSERT query
$insert->execute();

if ($insert->errno) {
  // Handle query error here
}

//close INSERT query
$insert->close();

//Retrieve the ImageId of the last uploded file
$lastID = $mysqli->insert_id; 

//Insert into Image_Question Table (be using last retrieved Image id in order to do this)
$imagequestionsql = "INSERT INTO Image_Question (ImageId, SessionId, QuestionId)  
VALUES (?, ?, ?)"; 

//prepare the above SQL statement
if (!$insertimagequestion = $mysqli->prepare($imagequestionsql)) { 
  // Handle errors with prepare operation here 
  echo "Prepare statement err imagequestion"; 
} 

//Retrieve the question number
$qnum = (int)$_POST['numimage'];

//bind the parameters (these are the values that will be inserted) 
$insertimagequestion->bind_param("isi",$lastID, 'Exam', $qnum); 

//execute INSERT query
$insertimagequestion->execute(); 

if ($insertimagequestion->errno) { 
  // Handle query error here 
} 

//close INSERT query
$insertimagequestion->close();

?>

<!--Javascript which will output the message depending on the status of the upload (successful, failed or cancelled)-->

<script>
    window.top.stopImageUpload(<?php echo $result; ?>, '<?php echo $_FILES['fileImage']['name'] ?>');
</script>
</body>

UPDATE:

Below is the php code “cancelimage.php” where I want to delete the cancelled file from the server and delete the record from the database. It is set up but not finished, can somebody finish it off so I can retrieve the name of the file and it’s id using $_SESSION?

<?php

// connect to the database
include('connect.php');

/* check connection */
if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
die();
}


//remove file from server
unlink("ImageFiles/...."); //need to retrieve file name here where the ... line is

//DELETE query statement where it will delete cancelled file from both Image and Image Question Table
$imagedeletesql = " DELETE img, img_q 
FROM Image AS img 
LEFT JOIN Image_Question AS img_q 
ON img_q.ImageId = img.ImageId 
WHERE img.ImageFile = ?"; 

//prepare delete query
if (!$delete = $mysqli->prepare($imagedeletesql)) {
// Handle errors with prepare operation here
}

//Dont pass data directly to bind_param store it in a variable
$delete->bind_param("s",$img);

//execute DELETE query
$delete->execute();

if ($delete->errno) {
// Handle query error here
}

//close query
$delete->close();

?>

Can you please provide an sample code in your answer to make it easier for me. Thank you

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Alright, like said in my previous answer, you could use the $_SESSION to store $lastID and $ImageFile.

    For example, after $lastID = $mysqli->insert_id; insert the following:

    $_SESSION['lastID'] = $lastID;
$_SESSION['ImageFile'] = $_FILES["fileImage"]["name"];

    This will store lastID and ImageFile in the session.

    in cancelimage.php you put the following:

    unlink("ImageFiles/" . $_SESSION['ImageFile']); 

$delete = $mysqli->prepare('DELETE FROM Image WHERE id = ?');
$delete->bind_param("i",$_SESSION['lastID']);
$delete->execute();

    Now add an action to the cancel button that updates the source of the iframe to cancelimage.php

    But there is a risk, because if the user has uploaded a file before, uploads a new one but the file didn’t get through (so the session vars are not set) then the previous file will be deleted.

    • 0