files get uploaded just before they get cancelled
Posted
by
user1763986
on Stack Overflow
See other posts from Stack Overflow
or by user1763986
Published on 2012-10-22T21:49:51Z
Indexed on
2012/10/22
23:00 UTC
Read the original article
Hit count: 126
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
© Stack Overflow or respective owner
