文件没有在jquery AJAX中上传

时间:2015-08-21 08:08:35

标签: php jquery ajax file

index.html是:

<form id="fileupload" method="POST" action="UploadHandler.php" enctype="multipart/form-data">           
<input type="file" id="files" name="files[]" multiple="multiple" title='Click to add Files'>
<input type="hidden" id="fileCnt" name="fileCnt" value="">
<input type="submit" name="btnAdd" id="btnAdd" class="buttonsub" value="Upload Files">
</form>
<script>
$('#fileupload').submit(function(e){
//window.location='assays.php';
var target = 'windowFormTarget';
window.open('', target, 'width=500,height=300');
this.setAttribute('target', target);
});
</script>

UploadHandler.php:

<html>
<head>
</head>
<body>
<table>
<th>Name</th>
<th>Size(in bytes)</th>
<th>Status</th>
<?php
for($i=0;$i<$_POST['fileCnt'];$i++)
{
echo '<tr>';
echo '<td>'.$_FILES['files']['name'][$i].'</td>';
echo '<td>'.$_FILES['files']['size'][$i].'</td>';
if($_FILES['files']['error'][$i] == 0)
{
    //print"<pre>";print_r($_FILES);die;
    //echo '<br/>'.$new_file_name = $_FILES['files']['name'][$i];
    //move_uploaded_file($_FILES['files']['tmp_name'][$i], 'uploads/'.$new_file_name);die;
    ?>
    <input type="hidden" name="name-<?php echo $i;?>" id="name-<?php echo $i;?>" value="<?php echo trim($_FILES['files']['name'][$i]);?>"/>
    <input type="hidden" name="tmp_name-<?php echo $i;?>" id="tmp_name-<?php echo $i;?>" value="<?php echo trim($_FILES['files']['tmp_name'][$i]);?>"/>
    <td>
        <div class="progress" id="done-<?php echo $i;?>">
            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
            Done
            </div>
        </div>      
        <div class="progress" id="wait-<?php echo $i;?>">
            <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
            Uploading..
            </div>
        </div>
    </td>
</tr>
<?php }
}
?>
</table>
<script>
$(document).ready(function() {
var fileCnt = <?php echo $_POST['fileCnt']; ?>;
var j=0;
var files =<?php echo json_encode($_FILES);?>;
function doAjax(j,fileCnt) {
$("#wait-"+j).show();
$("#done-"+j).hide();
var name = $('#name-'+j).val();
var tmp_name = $('#tmp_name-'+j).val();
alert("#done-"+j);
$.ajax({
       type: "POST",
       url: "postdata.php",        
       data: {                  
                'files':files,
                'id':j,
                'form_action': 'uploadFileData'
             },
        enctype:'multipart/form-data',
        success: function($succ){
                alert("result-"+$succ);
                if($succ == 1){
                $("#wait-"+j).hide();
                $("#done-"+j).show();                   
                }
                j++;
                if (j < fileCnt) {
                    doAjax(j,fileCnt);
                }
            }
    }); 
}
doAjax(j,fileCnt);
});
</script>
</body>
</html>

我的postdata.php是:

if(isset($_POST) && !empty($_POST))
        {
            $new_file_name = trim($_POST['files']['files']['name'][$_POST['id']]);
            $tmp_name = trim($_POST['files']['files']['tmp_name'][$_POST['id']]);
            if(move_uploaded_file($tmp_name, 'uploads/'.$new_file_name))
            {
                echo "1";die;
            }else{
                echo "0";die;
            }
        }

当用户在index.html上提交表单时,UploadHandler.php会在新窗口中打开。在uploadhandler.php的load事件中,循环中的多个文件的ajax请求将文件上传到目录。 现在问题是文件没有上传,我无法调试问题。

请帮忙。

2 个答案:

答案 0 :(得分:1)

从你的工作:我很抱歉,但这永远不会奏效。

如上所述,UploadHandler.php中的javascript可以访问文件名(甚至是tmp-names),但不能访问实际文件。

UploadHandler.php脚本接收文件($_FILES)。也就是说,服务器软件将上传的文件放入一些具有随机文件名的临时目录(该文件名在$_FILES['files']['tmp_name'][$i]中)。该脚本可以处理该文件。一件重要的事情是移动文件。该脚本开始编写html输出并将其发送到浏览器。然后,脚本完成,服务器将确保清理每个脚本。这意味着:删除上传的文件! (这就是为什么你应该移动它们,以防止这种情况。)

为了更好地理解文件上传的工作原理,最好再次阅读this php manual page上的问题。 The section on 'POST method uploads'实际上很好地解释了事情。

如果您真的想要一个进度条,建议您使用一些外部库。 This question and answers on SO可能会让你加快速度。

另请注意,通过ajax上传的文件尚未得到很好的支持,请参阅this answer on SO

答案 1 :(得分:0)

好吧,好吧,好吧。小错误。不是$_FILES而不是$_POST["files"]吗?您需要更改这些行:

$new_file_name = trim($_POST['files']['files']['name'][$_POST['id']]);
$tmp_name = trim($_POST['files']['files']['tmp_name'][$_POST['id']]);

将它们更改为:

$new_file_name = trim($_FILES['files'][$_POST['id']]['name']);
$tmp_name = trim($_FILES['files'][$_POST['id']]['files']['tmp_name']);

此外,[$_POST['id']]应该在["name"]["tmp_name"]之前。