title: React Dropzone Uploader submitting files on drop instead of when i click submit
body: <p>Exactly what the title says. I'm using React Dropzone Uploader (<a href="https://react-dropzone-uploader.js.org/" rel="nofollow noreferrer">https://react-dropzone-uploader.js.org/</a>). I use it mainly because i need to display pictures BEFORE uploading so i give the user the chance to select which pictures he wants to upload. The problem is that as soon as i drop or select the images they are sent. How should i go about sending the images once i press submit, because rightnow all it does is Erase the items from the list.
  I checked the network tab in DevTools, and it just sends a Post, when i click the little X it doesn't send anything.</p>
  <pre><code>
  
    // Put files into the form data
    const getUploadParams = ({ file }) =&gt; {
     const body = new FormData();
     body.append(`multi-images`, file);
    
     //im guessing here is where they get posted
     return { url: `https://page.com/api/album/${categoriaSeleccionada}/${albumSeleccionado}/uploadPhotos`, body
    }
   }
     
     // called every time a file's `status` changes
     const handleChangeStatus = ({ meta, file }, status) =&gt; { console.log(status, meta, file) }
     
     // receives array of files that are done uploading when submit button is clicked
     const handleSubmit = (files, allFiles) =&gt; {
       console.log(files.map(f =&gt; f.meta))
       allFiles.forEach(f =&gt; f.remove())
     }
   
     return (
       &lt;Dropzone
         getUploadParams={getUploadParams}
         name=&quot;multi-image&quot;
         inputContent={(image, extra) =&gt; (extra.reject ? 'Solo archivos de imagen' : 'Clickea aquí para buscar o arrastra archivos para subirlos')}
         onSubmit={handleSubmit}
         multiple={true}
         onChangeStatus={handleChangeStatus}
         styles={{
             dropzone: { 
                 minHeight: &quot;80vh&quot;, 
                 maxHeight: &quot;80vh&quot;,
                 maxWidth:&quot;80vw&quot;,
                 border: 0,
                 overflowX:&quot;hidden&quot;
                 }
             ,
             previewImage: {
                 minHeight: 200,
                 maxWidth: 500
             },
             preview:{
                 minHeight:230,
                 objectFit:&quot;cover&quot;
             }
             
         }}
       /&gt;
     )
   }
  
   export default Uploader
  </code></pre>
  <p><a href="https://i.stack.imgur.com/VmuwM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VmuwM.png" alt="Console of state change" /></a></p>
  <p>Is there a way i can make it wait till i press submit?</p>