使用jquery文件上传器和PHP上传多个文件

时间:2012-10-25 05:58:36

标签: php jquery ajax file-upload

我正在使用php mysql中的web应用程序。这个要求说,用户应该能够一次上传多个文件,将它们存储在服务器上。目前我可以上传一个文件此,

 $(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";
                }
        }

      }
   }

我如何自定义它以一次上传多个文件?我尝试搜索,但所有插件都是自定义的,以便使用某些用户界面,即它们有自己独立的模块和功能。
所以,对此的任何帮助将不胜感激。谢谢你的时间。 编辑:我正在添加动态创建文件输入的ajax uploader函数。

    /**
 * 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   
    };

我试过在name属性中添加一个数组,但是没有用。

2 个答案:

答案 0 :(得分:1)

您可以使用http://blueimp.github.com/jQuery-File-Upload/提供的Jquery插件一次上传多个文件。

答案 1 :(得分:1)

我刚刚在Grails项目上完成了一个多文件上传功能,使用本文作为指南(基于PHP)。如果你想自己动手 - 这是一个很好的参考。

http://net.tutsplus.com/tutorials/javascript-ajax/uploading-files-with-ajax/