Ajax Upload and Resize an Image with PHP

Hi Guys,
Today I am presenting the most important social networking feature called ajax upload and resize an image without refreshing the page using PHP and jquery.

demo




This article contains three folders called js,includes and uploads with PHP files.

  • includes
    — getExtension.php
    — compressImage.php
  • js
    — jquery.min.js
    — jquery.form.js
  • uploads
    index.php
    ajaximageupload.php




We can upload the image through PHP page. And resize the uploaded image using Ajax in php page.

Javascript Code







index.php

Contains simple PHP and HTML code. Here $session_id=1 means user id session value.




 

Upload image:

 

 

ajaximage.php

Contains PHP code. This script helps you to upload images into uploads folder. Image file name rename into timestamp+session_id.extention

";
}

//Original Image
if(move_uploaded_file($uploadedfile, $path.$actual_image_name))
{
//Insert upload image files names into user_uploads table
mysqli_query($db,"UPDATE users SET profile_image='$actual_image_name' WHERE uid='$session_id';");
echo "";
}
else
echo "failed";
}
else
echo "Image file size max 1 MB"; 
}
else
echo "Invalid file format.."; 
}
else
echo "Please select image..!";
exit;
}
?>

compressImage.php

Re-sizing image into different pixel dimensions.


getExtension.php

This extracts file extension.

function getExtension($str)
{
$i = strrpos($str,".");
if (!$i)
{
return "";
}
$l = strlen($str) - $i;
$ext = substr($str,$i+1,$l);
return $ext;
}

download

If anyone has doubts on this topic then please do let me know by leaving comments or send me an email.

Leave a Reply

Your email address will not be published.