Question

I am working on a web application in php mysql.Here,the requirement says,that the user should be able to upload more than one files at a time,to store them on server.Currently I can upload a single file using this,

 $(function(){
var btnUpload=$("#uploadPdf");
new AjaxUpload(btnUpload, {
    action:"uploadPdf.php",
    name: "uploadCertPdf",
    onSubmit: function(file, ext){
         if (!(ext && /^(pdf)$/.test(ext))){ 
            alert("Upload File (Supports PDF formats only)");
            return false;
        }           
        var stats = $("#resultsOuter");
        stats.html('<img src="images/layout/preloader-2.png" />');
    },
    onComplete: function(file, response){
            alert(response);
            alert("File uploaded successfully");
            window.location="somePage.php";

    }
  })
  });        

 /**somePage.php file**/

  if (isset($_FILES["uploadCertPdf"]))
  {
  if ($_FILES["uploadCertPdf"]["error"] > 0)
  {
      echo "Error: " . $_FILES["uploadCertPdf"]["error"] . "<br />";
  }
else
  {
       if(!is_dir($_SERVER['DOCUMENT_ROOT']."admin/pdf/"))
     {  echo "not found";
        mkdir($_SERVER['DOCUMENT_ROOT']."admin/pdf/", 0777,true);
     } 
         if(file_exists($file))
        {   echo "duplicate";
            $flag = TRUE;
        }
        else
        { 
            $uploaddir = '/admin/pdf/';
            $uploadfile = $uploaddir . basename($_FILES['uploadCertPdf']['name']);
            $path_info = pathinfo($_FILES['uploadCertPdf']['name']);
            $type= $path_info['extension']; 
            if($type == 'pdf')
            {   

                $flag = move_uploaded_file($_FILES['uploadCertPdf']['tmp_name'],$uploadfile);

            }else{
                echo "You can upload only PDF files";
                }
        }

      }
   }

How can I customize it to upload multiple files at a time?I tried to search,but all plugins are customized to use some user interface,i.e they have their own independent modules and functionalities.
So,any help with this would be appreciated.Thanks for the time.
EDIT: I am adding the ajax uploader function that creates a file input dynamically.

    /**
 * Creates invisible file input above the button 
 **/
_createInput : function(){
    var self = this;
    var input = d.createElement("input");
    input.setAttribute('type', 'file');
    input.setAttribute('name', this._settings.name);
    input.setAttribute('id', 'file'+this._settings.name);
    var styles = {
        'position' : 'absolute'
        ,'margin': '-5px 0 0 -175px'
        ,'padding': 0
        ,'width': '220px'
        ,'height': '30px'
        ,'fontSize': '14px'                             
        ,'opacity': 0
        ,'cursor': 'pointer'
        ,'display' : 'none'
        ,'zIndex' :  2147483583 //Max zIndex supported by Opera 9.0-9.2x 2147483583 
        // Strange, I expected 2147483647   
    };

I tried by adding an array to the name attribute,but did not work.

Answer 1

You can use Jquery Plugin available at http://blueimp.github.com/jQuery-File-Upload/ for multiple file upload at a time.