如何在formdata上追加输入的多个文件

时间:2019-07-24 11:21:53

标签: javascript php jquery html

我必须使用表单数据发送多个文件,但是我的代码无法正常工作,任何人都可以告诉我哪里出了问题。

$('#fileupload').on('change', function() {
  var to_user_id = $(this).data('touserid');
  var chat_id = $(this).data('chat_id');
  var formData = new FormData();
  $.each($('input[type=file]')[0].files, function(i, value) {
    formData.append('file[' + i + ']', value.files[0]);
  });
  //console.log(formData);
  formData.append('to_user_id', to_user_id);
  formData.append('chat_id', chat_id);
  $.ajax({
    url: 'upload.php',
    type: 'POST',
    data: formData,
    dataType: 'json',
    processData: false,
    contentType: false,
    cache: false,
    success: function(data) {
      //console.log(data);
    }
  })
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="post" name="upload_form" id="upload_form" enctype="multipart/form-data" action="upload.php">
  <input type="file" name="fileupload[]" id="fileupload" multiple data-touserid="'+to_user_id+'" data-chat_id="'+getdata+'">
</form>

2 个答案:

答案 0 :(得分:0)

您必须在表单数据中传递值

$.each($('input[type=file]')[0].files, function(i, value){
    formData.append('file['+i+']', value); // change this to value
});

我使用的示例代码

$.each($('#upload_screenshot')[0].files,function(key,input){
formData.append('upload_screenshot[]', input);
});

答案 1 :(得分:0)

请实现以下脚本代码。

$('#fileupload').on('change', function(){
    var to_user_id = $(this).data('touserid');
    var chat_id = $(this).data('chat_id');
    var form_data = new FormData();
    var ins = document.getElementById('fileupload').files.length;
    for (var x = 0; x < ins; x++) {
        form_data.append("documentfiles[]", document.getElementById('fileupload').files[x]);
    }
    if(ins > 0)
    {
        formData.append('to_user_id', to_user_id);
        formData.append('chat_id', chat_id); 
        $.ajax({
            url: 'upload.php',, 
            dataType: 'text', 
            cache: false,
            contentType: false,
            processData: false,
            data: form_data,
            type: 'post',
            success: function (response) {

            },
        });
    }
    else
    {
        alert("Please choose the file");
    } 
});

希望您的问题能得到解决。