Javascript:如何使用XMLHttpRequest获取此输入文件数组值

时间:2016-08-28 05:39:30

标签: javascript php jquery arrays

所以我有多个输入字段数组,我的html中的那些id是我的读者需要特定的个人形象,这就是为什么我需要它而不是单个字段。 (为我的英语道歉)

现在我的问题是我只得到了那两个字段的1个数组文件。

控制台

 [File, File]
 0: File // I need this
 1: File // both of this post to my php
 length: 2
 __proto__: Array[0]
//Both file have different value and fine.

但不幸的是,这是我在.php

中的var_dump时的结果
//response
array (size=1)
'file_name' => 
 array (size=5)
  'name' => string '918313_orig.jpg' (length=15)
  'type' => string 'image/jpeg' (length=10)
  'tmp_name' => string 'C:\wamp\tmp\php4BE4.tmp' (length=23)
  'error' => int 0
  'size' => int 70219

array (size=0)
  empty //<-- Why is this empty while my array in console seems good
//it shows only 1 file instead of 2

我如何得到这样的响应:

var_dump($_FILES);

//response
array (size=1)
'file_name' => 
 array (size=5)
  'name' => string '918313_orig.jpg' (length=15)
  'type' => string 'image/jpeg' (length=10)
  'tmp_name' => string 'C:\wamp\tmp\php4BE4.tmp' (length=23)
  'error' => int 0
  'size' => int 70219

array (size=0)
  'file_name' => 
 array (size=5)
  'name' => string 'anotherImage.jpg' (length=15)
  'type' => string 'image/jpeg' (length=10)
  'tmp_name' => string 'C:\wamp\tmp\php4BE4.tmp' (length=23)
  'error' => int 0
  'size' => int 70219

HTML

input type="file" name="file_name[]" id="file_id_0">
input type="file" name="file_name[]" id="file_id_1">
input type="file" name="file_name[]" id="file_id_2">

JS

$(document).on('click','#btn_proceed',function(e){


e.stopPropagation();
e.preventDefault();
$('#frm_contestant').bootstrapValidator('validate');

var imageContainer = []; //I compressed each value of field in this array

var file_name = document.getElementsByName('file_name[]');
for(var i = 0; i<file_name.length; i++){
    var fileUpload = document.getElementById('file_id_'+i);
    imageContainer.push(fileUpload.files[0]);
}

var data = new FormData();
for(var b=0; b<imageContainer.length; b++){
    data.append('file_name', imageContainer[b]);
}



var param = "?event_hidden_id="+encodeURIComponent(event_id);
xhr = new XMLHttpRequest();
var url = '../ajax/ajax_add/ajax_addContestant.php';

xhr.open('post', url+param, true);
xhr.send(data);
//console.log(JSON.stringify(file_nameArr));

});

0 个答案:

没有答案