Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Pierre Smith
Pierre Smith
11,842 Points
Posted by Pierre Smith
Pierre Smith
11,842 Points

FormData returning an extra empty file

now here is my code: html

<input class="frm_file" type="file" name="files[]" id="file" data-multiple-caption="{count} files selected" multiple />

js init and loading of formData var

var $form  = $( '.frm' ),
     files = [],
    $input = $form.find( 'input[type="file"]' );

var formData = new FormData( $form.get( 0 ) );

if ( files ) {
  // loop runs through the dragged & dropped files.
  $.each( files, function( i, file ) {
  // adds them to the data stack which will be submitted via Ajax
  formData.append( $input.attr( 'name' ), file );
  });

}

"files" is an array that I use to aggregate all my files that may be uploaded by drag and drop or by selection.

Now i'm aware that in order to log the items placed in formData you must use something like below

for ( var [key, value] of formData.entries() ) {
  console.log( 'key value', key, value );
}

which logs

key value files[]

key value ajax 1

key value files[] File { name: "Screen Shot 2016-08-26 at 2.08.47 Pā€¦", lastModified: 1472234932000, lastModifiedDate: Date 2016-08-26T18:08:52.000Z, webkitRelativePath: "", size: 643733, type: "image/png" }

Now my problem is when logging formData after uploading only one file, it appears as though i'm getting two files[] one "empty" and one with the correct file, what am I missing?