PHP Classes

File Upload With AJAX: Handle file uploads and returns JSON response

Recommend this page to a friend!
  Info   View files Example   View files View files (4)   DownloadInstall with Composer Download .zip   Reputation   Support forum (1)   Blog    
Ratings Unique User Downloads Download Rankings
StarStarStar 56%Total: 651 All time: 4,919 This week: 135Up
Version License PHP version Categories
ajax-file-upload 1.0Freeware5PHP 5, Files and Folders, AJAX
Collaborate with this project 

Author

fileuploadwithajax - github.com

Description

This is a simple class that can handle file uploads and returns JSON response.

It can take the $_FILES array as parameter and checks if a file with a given input name was uploaded successfully.

If the file was received, it is moved to the uploads directory.

The class creates an array with the response details and outputs the array JSON encoded so it is easier for the JavaScript to handle.

The details include a success message with a download link, and the name of the file that was stored. If the upload fails, an error message is returned.

Recommendations

What is the best PHP AJAX file upload class?
I want to upload files using AJAX

Upload images using AJAX
Trying to upload avatar file

Picture of Bharat Parmar
  Performance   Level  
Name: Bharat Parmar <contact>
Classes: 11 packages by
Country: India India
Age: 32
All time rank: 52230 in India India
Week rank: 198 Up18 in India India Up
Innovation award
Innovation award
Nominee: 3x

Example

<!DOCTYPE html>
<html>
    <head>
        <title>File Upload with AJAX : </title>
        <script src="js/jquery.min.js"></script>
    </head>
<body>

<form method="post" enctype="multipart/form-data" id="myform">
    <h3>Select File to upload</h3>
    <input type="file" name="demo_file" class="file-upload-ajax">
    <hr>
    <div class="uploaded-files"></div>
</form>
<script type="text/javascript">
    $(document).ready(function(){
          /*BEGIN FILE UPLOADING WITH CODE*/
             $('.file-upload-ajax').on('change',function(){
                  if(confirm("Are You Sure to Upload This File ?")) {
                      $(this).after('<span class="temp-message">File Uploading.....</span>');
                    var formdata = new FormData($("#myform")[0]);
                    $.ajax({
                        type: "POST",
                        url: "ajax.class.php?func=uploadfile",
                        enctype: 'multipart/form-data',
                        data: formdata,
                        async: false,
                        contentType: false,
                        processData: false,
                        cache: false,
                           success: function(msg)
                        {
                            $response = $.parseJSON(msg);
                                $('.temp-message').text($response.message);
                                $('.file-upload-ajax').val('');
                                $('.uploaded-files').append($response.response_html);
                        }
                        //success ends
                    });

                  } else {
                      $('.file-upload-ajax').val('');
                  }
             });
          /*END FILE UPLOADING WITH CODE*/
    });
</script>
</body>
</html>


  Files folder image Files  
File Role Description
Files folder imagejs (1 file)
Plain text file ajax.class.php Class Class file which includes file upload function
Accessible without login Plain text file example.php Example Example file
Accessible without login Plain text file README.md Data Plugin Description file

  Files folder image Files  /  js  
File Role Description
  Accessible without login Plain text file jquery.min.js Data Jquery File for ajax and javascript functions

 Version Control Unique User Downloads Download Rankings  
 100%
Total:651
This week:0
All time:4,919
This week:135Up
User Ratings User Comments (2)
 All time
Utility:80%StarStarStarStarStar
Consistency:75%StarStarStarStar
Documentation:-
Examples:90%StarStarStarStarStar
Tests:-
Videos:-
Overall:56%StarStarStar
Rank:1743