Jump to content

delete function without refresh

StefanRSA

By StefanRSA
in Javascript Help

 Share

Recommended Posts

StefanRSA Regular Member

StefanRSA

Posted
Posted

Hi guys... I am now the proud owner of a very nice image upload script that uploads an image to my server without refreshing the page....

 

It makes use of Iframes.

Can you please look at my code and help me to create the delete function.

After upload, I want the delete link or image to be in the same Iframe as the uploaded image....

 

I am just not to sure how I should write the function and make sure the the image name gets carried over to the delete.php page and then update the iframe so the upload field apears again....

 

Any help?????

 

My code so far:

 

imageupload.php:

<html>
<head>
<title>Image Upload and Preview without Page Refresh TEST</title>
<script type="text/javascript">

function ajaxFileUpload(upload_field)
{
// Checking file type
var re_text = /\.jpg|\.gif|\.jpeg/i;
var filename = upload_field.value;
if (filename.search(re_text) == -1) {
alert("File should be either jpg or gif or jpeg");
upload_field.form.reset();
return false;
}
document.getElementById('picture_preview').innerHTML = '<div><img src="../images/loader_light_blue.gif" border="0" /></div>';
upload_field.form.action = 'ajaxupload.php';
upload_field.form.target = 'upload_iframe';
upload_field.form.submit();
upload_field.form.action = '';
upload_field.form.target = '';
return true;
}
</script>
</head>
<!-- iframe used for ajax file upload-->
<iframe name="upload_iframe" id="upload_iframe" style="display:none;"></iframe>
<!-- iframe used for ajax file upload-->

<form name="pictureForm" method="post" autocomplete="off" enctype="multipart/form-data">
<div>
<span>Upload Picture :</span>

<span id="picture_error"><input type="file" name="img1" id="picture" onchange="return ajaxFileUpload(this);" /></span><br>
<span id="picture_preview"></span><br>
<span id="preview_picture_tag" name="preview_picture_tag"></span>

</div>
</form>

 

And then the image upload file:

<?php
include $root.'../incl/config.php';
error_reporting(0);
$pictot = 4;
$change="Image Uploaded!";
$imgNumb=1;
define ("MAX_SIZE","1500");
function getExtension($str) {
         $i = strrpos($str,".");
         if (!$i) { return ""; }
         $l = strlen($str) - $i;
         $ext = substr($str,$i+1,$l);
         return $ext;
}

$errors=0;
do{
if($_FILES["img$imgNumb"]["tmp_name"]!=''){
	$image =$_FILES["img$imgNumb"]["name"];
$uploadedfile = $_FILES["img$imgNumb"]['tmp_name'];
     

	if ($image) 
	{

		$filename = stripslashes($_FILES["img$imgNumb"]['name']);

  		$extension = getExtension($filename);
		$extension = strtolower($extension);


if (($extension != "jpg") && ($extension != "jpeg") && ($extension != "png") && ($extension != "gif")) 
		{

			$change='<div class="msgdiv">Unknown Image extension </div> ';
			$errors=1;
		}
		else
		{

$size=filesize($_FILES["img$imgNumb"]['tmp_name']);


if ($size > MAX_SIZE*1024)
{
$change='<div class="msgdiv">You have exceeded the size limit!</div> ';
$errors=1;
}


if($extension=="jpg" || $extension=="jpeg" )
{
$uploadedfile = $_FILES["img$imgNumb"]['tmp_name'];
$src = imagecreatefromjpeg($uploadedfile);

}
else if($extension=="png")
{
$uploadedfile = $_FILES["img$imgNumb"]['tmp_name'];
$src = imagecreatefrompng($uploadedfile);

}
else 
{
$src = imagecreatefromgif($uploadedfile);
}

echo $scr;

list($width,$height)=getimagesize($uploadedfile);

$newwidthX=520;
$newheightX=($height/$width)*$newwidthX;
if($newheightX > 520) {
$newheight=520;
$newwidth=($newwidthX/$newheightX)*$newheight;
} else {
$newheight = $newheightX;
$newwidth = $newwidthX; } 
$tmp=imagecreatetruecolor($newwidth,$newheight);

$newwidth1=130;
$newheight1=($height/$width)*$newwidth1;
$tmp1=imagecreatetruecolor($newwidth1,$newheight1);

if ($imgNumb == 1){
$newwidth2=65;
$newheight2=($height/$width)*$newwidth2;
$tmp2=imagecreatetruecolor($newwidth2,$newheight2);
}

imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
imagecopyresampled($tmp1,$src,0,0,0,0,$newwidth1,$newheight1,$width,$height);
if ($imgNumb == 1){
imagecopyresampled($tmp2,$src,0,0,0,0,$newwidth2,$newheight2,$width,$height);
}
/// SET IMAGE NAMES HERE!!!!!!!!!!!!!!!!!!!!!!!!!
//$image_name=time().'.'.$extension;
$Unique=microtime(); // We want unique names, right?
$image_name=md5($Unique).'.'.$extension;
$dbimgname=$imgNumb.'_'.$image_name;
$filename = '../ad_images/'.$imgNumb.'_'.$image_name;
$filename1 = '../ad_images/130/'.$imgNumb.'_'.$image_name;
if ($imgNumb == 1){
$filename2 = '../ad_images/65/'.$imgNumb.'_'.$image_name;
}

imagejpeg($tmp,$filename,70);
imagejpeg($tmp1,$filename1,70);
if ($imgNumb == 1){
imagejpeg($tmp2,$filename2,70);
}
imagedestroy($src);
imagedestroy($tmp);
imagedestroy($tmp1);
if ($imgNumb == 1){
imagedestroy($tmp2);
}
}}
//mysql update your database fields

}

$imgNumb++;
} while($_FILES["img$imgNumb"][name]);
////////////////////////////////////////////////////////////////////////////////////////////////

// This is a PHP code outputing Javascript code.
echo '<script language="JavaScript" type="text/javascript">'."\n";
echo 'var parDoc = window.parent.document;';
echo "parDoc.getElementById('picture_error').innerHTML = '".$change."';";


if($dbimgname != '') {
echo "parDoc.getElementById('picture_preview').innerHTML = '<img src=\'../ad_images/130/$dbimgname\' id=\'preview_picture_tag\' name=\'preview_picture_tag\' />';";
}

echo "\n".'</script>';
exit(); // do not go futher

?>

Link to comment
Share on other sites
StefanRSA Regular Member

StefanRSA

Posted
  • Author
Posted

I must also ad that I know how to delete the images as well as the DB entries with the following code:

if ($_GET['delete']=='image') {
$deleteimage = $_GET['pic'];
//echo $deleteimage;
$filename = "../ad_images/$deleteimage";
$filename1 = "../ad_images/130/$deleteimage";
$filename2 = "../ad_images/65/$deleteimage";
unlink($filename);
unlink($filename1);
unlink($filename2);
mysql_query("DELETE FROM ad_image WHERE ad='$adnr' AND user='$user' AND image='$deleteimage'") 
or die(mysql_error());
//echo "Image deleted!"; 
}

 

But how do I get the values ($_GET['pic'];) with JS to the deleteimage.php file so I can delete the image without refresh???

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.