javascript - Is my way right to keep the previous value of file input in HTML? -


i'm using asp.net & want allow user upload multiple files multiple selection.

i searched many times on google , found way: if can append previous file (value) file input achieve want.

since read question: how set value file input in html?

my idea went wrong.

then, got solution: if clone input file?

let's test. (i don't want mention asp.net or asp.net core @ all. so, can test php if want. it's testing.)

model:

public class mymodel {     public ienumerable<iformfile> files { get; set; } } 

razor:

<form method="post">     <!-- <input type="file" id="files" name="files" multiple /> -->     <input asp-for="files" />     <button type="submit">submit</button> </form> 

script:

let onchanged = function () {     let files = array.from(this.files);      (let file of files) {         // 'file' (previewing before uploading, etc...)     }      // if don't clear 'name' attribute here,     // caught event in next time.     // can add "hidden" class hide     $(this).clone().prop('name', '').prependto('form'); };  let submit = function (e) {     e.preventdefault(); // delay submitting      // update 'name' property file inputs.     $('[type=file]').prop('name', 'files');      // try submit     $('form').submit();      // now, if 1 file input contains 1 uploaded file     // in server, 'files.count()' return number     // equals '$([type=file]).length'      // files.count() == $([type=file]).length };  $(document)     .on('change', '[name=files]' onchanged);         .on('click', 'button', submit); 

running: click file input , select 1 file -> i'll clone file input. try again, i'll 2. after submitting, have 2 uploaded files. that's good.

why want achieve this? it's because i'm using dropzone plugin upload file. there no way put file input dropzone.

testing:

<div class="dropzone">     <!-- removed after pluggin completes setting -->     <div class="fallback">         <input asp-for="files" />     </div> </div>  <script>    // before submiting form    console.log($('#files').length); // 0 </script> 

my question: there risk if clone file input that?

thank you!

expand question:

although dropzone provides option: url upload file before previewing, want keep file in client, not ready upload server.

something this:

<form method="post" action="/question/ask">     <!-- text input here -->     <input asp-for="title" />      <!-- pannel used uploading files... -->     <div class="dropzone">         ...     </div>      <!-- click button submit (sending files server) -->     <button type="submit">submit</button> </form> 

if allow upload file before submiting , user uploads 10 files, leaving without submitting. can unused files?


Comments

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -