2013-12-09 24 views
0

我一直在嘗試使用ajax獲得一個很好的整潔的文件上傳,並從許多項目上我已經能夠得到框架完成如下: 我的HTML:試圖上傳一個文件,使用HTML5和ajax

<form enctype="multipart/form-data" method="post"> 
<input name="file" type="file" /> 
<input type="button" value="Upload" /> 

漂亮的直線前進。

我的PHP storeSales.php

if ($_FILES["file"]["name"] != NULL) { 
if (file_exists("accounting/" . $_FILES["file"]["name"])){ 
echo $_FILES["file"]["name"] . " already exists. "; 
}else{ 
move_uploaded_file($_FILES["file"]["tmp_name"], "accounting/" . $_FILES["file"]["name"]); 
} 
} 
$file = fopen($_FILES['myfile']['name'],'r') or die('cant open file'); 

和我的.js:

$(":button").click(function(){ 
var formData = new FormData($('form')[0]); if (formData !=null) { 
alert("Got the file"); 
} else { 
alert("nothing Here"); 
} 

$.ajax({ 
    url: 'storeSales.php', //Server script to process data 
    type: 'POST', 
    xhr: function() { // Custom XMLHttpRequest 
     var myXhr = $.ajaxSettings.xhr(); 
     if(myXhr.upload){ // Check if upload property exists 
      myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload 
     } 
     return myXhr; 
    }, 
    //Ajax events 

    success: function(result) 
{ 
    console.log($.ajaxSettings.xhr().upload); 
    alert(result); 
}, 

    // Form data 
    data: formData, 
    //Options to tell jQuery not to process data or worry about content-type. 
    cache: false, 
    contentType: false, 
    processData: false 
}); 
}); 
function progressHandlingFunction(e){ 
if(e.lengthComputable){ 
    $('progress').attr({value:e.loaded,max:e.total}); 
} 
} 

當我嘗試上傳文件,我得到的警報在我的.js文件,上面寫着「得到了文件「,但在PHP代碼中,我收到文件不能爲空的錯誤。從我所能找到的所有東西中,我認爲我正確地做了php。處理這個問題的正確方法是什麼?我錯過了別的嗎?

+0

你弄清楚什麼呢?我的回答有幫助嗎? –

回答

2

您不能使用ajax上傳文件 - 這是一個非法操作(通過幹阿賈克斯路線),沒有第三方腳本。總之,您無法通過Ajax傳遞$_FILES數據。數據只有$_POST。你需要找到一個插件。

嘗試Uploadifyhttp://www.uploadify.com/