Ajax多文件上传不起作用

时间:2015-04-24 18:12:41

标签: javascript php jquery ajax

我使用此代码来传递ajax的所有文件输入。 html代码中有三个输入文件。但是只有第一个文件输入由ajax发送。如何修复此代码?我的错误在哪里?

$("#add_order").click(function () {

    //*****get data input
    var formData = new FormData(); 
        formData.append( 'action', 'add_order');

    $.each($("input[type=file]"), function(i, obj) {
        $.each(obj.files,function(j,file){
            alert(file.name);
            formData.append('orderpic[]', file);
        });
    });

    //ajax start and ajax complatet
    ajax_loading();

    $.ajax({
        url: "includes/ajax/ajax.php",
        data: formData,
        processData: false,
        contentType: false,
        type: 'POST',
        dataType:'json',
        success: function(response){
           //load json data from server and output message     
           if(response.type == 'error'){ //load json data from server and output message     
               output = '<div class="alert alert-danger" style="margin-top:12px;">'+response.text+'</div>';
           }else{
               output = '<div class="alert alert-success" style="margin-top:12px;">'+response.text+'</div>';
               resetAllValues();
               setTimeout(function() {
                    $('#new-order').modal('hide');
                }, 1500);
           }
           $("#results").hide().html(output).fadeIn('slow').delay(800).fadeOut();
    });        
});

HTML code:

<input type="file" name="orderpic[]" id="orderpic" class="form-control">
<input type="file" name="orderpic[]" id="orderpic" class="form-control">
<input type="file" name="orderpic[]" id="orderpic" class="form-control">

PHP代码:

//file settings
    $files = array();
    for($i=0; $i<count($_FILES['orderpic']['name']); $i++) {
        //Get the temp file path
        $tmpFilePath = $_FILES['orderpic']['tmp_name'][$i];

        //Make sure we have a filepath
        if ($tmpFilePath != "") {
            //Setup our new file path
            $time = time();
            $ext = pathinfo($_FILES['orderpic']['name'][$i], PATHINFO_EXTENSION);
            $FilePath = $uploaddir . $time .'.'. $ext;

            //Upload the file into the temp dir
            if (move_uploaded_file($tmpFilePath, $FilePath)) {
                $resizeObj = new resize($FilePath);
                $resizeObj -> resizeImage(200, 350, 'portrait');
                $newFilePath = $uploaddir. "200_350_" .$time.'.'.$ext;
                $resizeObj -> saveImage($newFilePath, 100);
                unlink($FilePath);
                $files[] = "200_350_" .$time.'.'.$ext;
            }
        }
    }

2 个答案:

答案 0 :(得分:0)

输入控件的

'id'不能相同。将其更改为下面的html中显示的内容,它应该可以工作。

    <input type="file" name="orderpic[]" id="orderpic1" class="form-control">
    <input type="file" name="orderpic[]" id="orderpic2" class="form-control">
    <input type="file" name="orderpic[]" id="orderpic3" class="form-control">

答案 1 :(得分:0)

可能由于未在basename($_FILES['orderpic']['name'][$i])$FilePath使用$newFilePath而导致。

试试这个:

for($i=0; $i<count($_FILES['orderpic']['name']); $i++) {
        //Get the temp file path
        $tmpFilePath = $_FILES['orderpic']['tmp_name'][$i];

        //Make sure we have a filepath
        if ($tmpFilePath != "") {
            //Setup our new file path
            $time = time();
            $ext = pathinfo($_FILES['orderpic']['name'][$i], PATHINFO_EXTENSION);
            //$FilePath = $uploaddir . $time .'.'. $ext;
            $FilePath = $uploaddir . $time. basename($_FILES['orderpic']['name'][$i]);

            //Upload the file into the temp dir
            if(move_uploaded_file($tmpFilePath, $FilePath)){
                $resizeObj = new resize($FilePath);
                $resizeObj -> resizeImage(200, 350, 'portrait');
                $newFilePath = $uploaddir ."200_350". $time. basename($_FILES['orderpic']['name'][$i]);
                $resizeObj -> saveImage($newFilePath, 100);
                unlink($FilePath);
                $files[] = "200_350". $time. basename($_FILES['orderpic']['name'][$i]);
            }
        }
    }