Hi..
I want to upload a file using Ajax, Jquery and PHP in such a way so that my page doesn't get refresh while submit the form.
But I found the solution to use the iframe, I found it little bit complex and bit tricky what about if I say you do not required the iframe to upload??
Download the sample and try your self its straight and simple, not a tricky one.
Uploader Sample..
Index page with form
<form action="uploader.php" id="FileUploader" enctype="multipart/form-data" method="post" >
<label>Name
<span class="small">I will add a random no.</span>
</label>
<input type="text" name="mName" id="mName" />
<label>File
<span class="small">Choose a File</span>
</label>
<input type="file" name="mFile" id="mFile" />
<button type="submit" class="red-button" id="uploadButton">
Upload (1MB)
</button>
<div class="spacer"></div>
</form>
In uploader.php we have following code -
<?php
//Upload Directory, ends with slash & make sure folder exist
$UploadDirectory = 'uploads/';
// checking uploading directory exist or not.
if (!@file_exists($UploadDirectory)) {
//if destination folder does not exist
die("Make sure Upload directory exist!");
}
if($_POST)
{
if(!isset($_POST['mName']) || strlen($_POST['mName'])<1){
//required variables are empty
die("Title is empty!");
}
if(!isset($_FILES['mFile'])){
//required variables are empty
die("File is empty!");
}
if($_FILES['mFile']['error']){
//File upload error encountered
die(upload_errors($_FILES['mFile']['error']));
}
//uploaded file name, extension, type, size and a random number
$FileName = strtolower($_FILES['mFile']['name']);
$ImageExt = substr($FileName, strrpos($FileName, '.'));
$FileType = $_FILES['mFile']['type'];
$FileSize = $_FILES['mFile']["size"];
$RandNumber = rand(0, 9999999999);
switch(strtolower($FileType))
{
//allowed file types
case 'image/png': //png file
case 'image/gif': //gif file
case 'image/jpeg': //jpeg file
case 'application/pdf': //PDF file
case 'application/msword': //ms word file
case 'application/vnd.ms-excel': //ms excel file
case 'application/x-zip-compressed': //zip file
case 'text/plain': //text file
case 'text/html': //html file
case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': //html file
break;
default:
die('Unsupported File!'); //output error
}
//Rename and save uploded file to destination folder.
$NewFileName = $_POST['mName'].'_'.$RandNumber.$ImageExt;
if(move_uploaded_file($_FILES['mFile']["tmp_name"], $UploadDirectory.$NewFileName ))
{
die('Success! File Uploaded.');
}
else
{
die('error uploading File!');
}
}
function upload_errors($err_code)
{
switch ($err_code)
{
case UPLOAD_ERR_INI_SIZE:
return 'The uploaded file exceeds the upload_max_filesize directive in php.ini';
case UPLOAD_ERR_FORM_SIZE:
return 'The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form';
case UPLOAD_ERR_PARTIAL:
return 'The uploaded file was only partially uploaded';
case UPLOAD_ERR_NO_FILE:
return 'No file was uploaded';
case UPLOAD_ERR_NO_TMP_DIR:
return 'Missing a temporary folder';
case UPLOAD_ERR_CANT_WRITE:
return 'Failed to write file to disk';
case UPLOAD_ERR_EXTENSION:
return 'File upload stopped by extension';
default:
return 'Unknown upload error';
}
}
?>
Happy Coding..
