I am a new programmer. I found many solution regarding this issue but failed to solve my problem.
I am trying to upload multiple images in web.
The HTML:
<input type="file" multiple="multiple" name="uploadcertbtn[]" />
I append dynamic number or rows below the above row in this way, so I have multiple input type=file button
, The JS for this purpose:
$(document).ready(function () {
$('#addrow').click(function () {
$('.tbody').append(" <tr ><td ><input type='file' multiple='multiple' name='uploadcertbtn[]' /></td></tr> ");
});
});
Javascript to add file objects in a variable:
var $certimages = [];
$("input[name='uploadcertbtn[]']").each(function(){
for(var i=0;i<$(this).get(0).files.length;++i){
$certimages.push($(this).get(0).files[i]);
}
});
I Test the $certimages array value in this way and it is printing file objects properly.
for(var i=0; i<$certimages.length; i++){
console.log($certimages[i]);
}
Then I made a FormData object and append the variable in this way:
var formData = new FormData();
formData.append('certificateImagesArray[]', $certimages );
Then I tried to print the formdata values in this way but $certimages variable prints only:
[object File],[object File]
Code to print the formdata values:
for (var value of formData.values()) {console.log(value);}
Please help me to print the file object properly.