Search code examples
phpjqueryjquery-pluginsmultifile-uploader

Multiple file uploader using pure JQuery and PHP5?


I need a multiple file uploader created by pure jquery/Javascript and php5. Not use any flash files. If any body have code for that please share with me. I tried with File API but its not supporting IE and Opera.


Solution

  • You can use blueimp jQuery File Upload for the client side to have multiple file uploads. Has many options, is customizable.

    For a PHP side you may be interested in some ideas on what to do (just some snippet for my upload form for images, so some variables are not defined here like $log or $confImages, but you can get the idea):

                //Сheck that we have a file
                if (empty($uploaded_image))
                return false;
            if ($uploaded_image['error']) {
                $log->LogError($uploaded_image['error'] . ": Error uploading file.");
                return false;   
            }
    
            list($dirname, $basename, $extension, $filename) = array_values(pathinfo($uploaded_image['name'])); //Extract variables: dirname, basename, extension, filename
            //Normalize file name. I may suggest using http://cubiq.org/the-perfect-php-clean-url-generator than this
            $filename = iconv("utf-8","ascii//TRANSLIT",$filename);
                $allowedExt = array("jpg","jpeg","gif","png");
            $extension = strtolower($extension);
    
            //Check if the image has allowed type
            if (empty($extension) || !in_array($extension, $allowedExt)) {
                $log->LogError("invalid_extension: Not allowed to upload file ".(empty($extension) ? "without extension" : "with extension $extension").". Allowed Extensions: ". implode(",",$allowedExt));
                return false;   
            }
    
                //Generate some random string in case if such file exists on server
            $postfix = substr( md5(uniqid(rand(),1)), 3, 5 );
            $newFile = $_SERVER['DOCUMENT_ROOT'].$upload_folder."/".$filename.'_'.$postfix.'.'.$extension; //new filename with appended random string to original filename);
    
            //Check if the file with the same name is already exists on the server
            if (file_exists($newFile)) {
                $log->LogError("file_exists: File couldn't be uploaded, because such filename exist ".basename($newFile)." jau eksistē");
            }
    
            //Attempt to move the uploaded file to it's new place
            if (move_uploaded_file($uploaded_image['tmp_name'],$newFile)) {
                //I do some resizing also using http://phpthumb.gxdlabs.com/
                $convertedimage = PhpThumbFactory::create($newFile, array("jpegQuality" => 80));
                if (isset($confImages["max_width"]) || isset($confImages["max_height"])) 
                    $convertedimage->resize($confImages["max_width"], $confImages["max_height"]);
                $convertedimage->save( $newFile );
    
                //Save image path to database
                ...
    
                return $image;
            } else {
                $log->LogError("Couldn't copy file from temp folder " . $uploaded_image['tmp_name'] . " to location " . $newFile);
            }       
    
            return false;