più file selezionare e caricare

Sto usando questo codice per i file caricati su un server (in html):più file selezionare e caricare

<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1"> 
    <label>upload file<input type="file" name="file" id="file" /></label> 
    <label><input type="submit" name="button" id="button" value="Submit" /></label></form>

E 'file browser aperta e mi permette di selezionare un file, e quando si preme sul inviare il file viene inviato al mio server.

Mi chiedo se c'è un modo per rendere più file di selezione.

fonte

2011-12-29 MTA

Vedi anche [selezionare più file in upload di file in PHP] (http: // StackOverflow.it/questions/2071505/select-multiple-files-in-file-upload-in-php) – rds

Esistono molti plugin jQuery come http://www.uploadify.com/ che consentono di eseguire più caricamenti di file. –

È possibile utilizzare l'attributo multiple per questo, come questo:

<input type="file" multiple />

Per selezionare più file è necessario premere il tasto Ctrl e fare clic sui file che si desidera aggiungere.

fonte

2011-12-29 15:19:25

Non funziona in IE – Exception

Ho appena provato e ha funzionato in IE11. Secondo Microsoft, la possibilità di selezionare più file per un singolo campo HTML INPUT TYPE = FILE è nuova per HTML5 e non è supportata da IE9 o versioni precedenti. – derloopkat

Ti permetterà di selezionare più file contemporaneamente, ma ciò non significa che ti permetterà di caricare più file. Devi permetterlo nel tuo js (se ne hai uno per barra di avanzamento, caricare ajax o caricare lo scopo di stato) e il codice lato server come php, ASP. –

Il modo più semplice è quella di impaginare i campi direttamente, in questo modo:

<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1"> 
<label>upload file<input type="file" name="file[]" id="file1" /></label> 
<label>upload file<input type="file" name="file[]" id="file2" /></label> 
<label>upload file<input type="file" name="file[]" id="file3" /></label> 
<label><input type="submit" name="button" id="button" value="Submit" /></label></form>

this Leggi su come gestire i file sul lato server.

Tuttavia, se volete qualcosa di più bello si dovrebbe dare un'occhiata a uploadify.

** Per quanto riguarda la risposta @dotwebs, l'attributo multipla è not supported by some browsers.

fonte

2011-12-29 15:28:52 Magnus

Il tuo primo collegamento è rotto. – freemanoid

Grazie. Non ricordo quale link stavo pensando, ma ora ho inserito un link al manuale PHP ufficiale. – Magnus

File multipla Selezionare & Carica Utilizzando il framework Spring

In questo post ho descritto lato server e il codice lato client per caricamento di più file.

seguito il codice è per citare i dati più parti in appContext.xml

appContext.xml

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> 
    <!-- one of the properties available; the maximum file size in bytes --> 
    <property name="maxUploadSize" value="20971520"/> 
</bean>

Simpleupload.jsp:

sceneggiatura di più upload dei file:

<script type="text/javascript"> 
    var totalsizeOfUploadFiles = 0; 
    function getFileSizeandName(input) 
    { 
     var select = $('#uploadTable'); 
     for(var i =0; i<input.files.length; i++) 
     {   
      var filesizeInBytes = input.files[i].size; 
      var filesizeInMB = (filesizeInBytes/(1024*1024)).toFixed(2); 
      var filename = input.files[i].name; 
      //alert("File name is : "+filename+" || size : "+filesizeInMB+" MB || size : "+filesizeInBytes+" Bytes"); 
      if(i<=4) 
      {    
       $('#filetd'+i+'').text(filename); 
       $('#filesizetd'+i+'').text(filesizeInMB); 
      } 
      else if(i>4) 
       select.append($('<tr id=tr'+i+'><td id=filetd'+i+'>'+filename+'</td><td id=filesizetd'+i+'>'+filesizeInMB+'</td></tr>')); 
      totalsizeOfUploadFiles += parseFloat(filesizeInMB); 
      $('#totalsize').text(totalsizeOfUploadFiles.toFixed(2)+" MB"); 
      if(i==0) 
       $('#filecount').text("1file"); 
      else 
      { 
       var no = parseInt(i) + 1; 
       $('#filecount').text(no+"files"); 
      }      
     }   
    } 

    function CloseAndRefresh() 
    { 
     opener.location.reload(true); 
     self.close(); 
    }  
</script>

01 modulo

html design:

<body> 
<form method="post" id="uploadForm" action="upload" enctype="multipart/form-data"> 
    <table class="span10"> 
     <tr> 
      <td colspan="3"> 
       <legend>Simple Upload</legend> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <input type="file" name="files[]" multiple="multiple" onchange="getFileSizeandName(this);"/> 
      </td> 
     </tr> 
     <tr>  
      <td colspan="3"> 
       <div id="uploaddiv"> 
        <table id="uploadTable" class="table table-striped table-bordered"> 
         <tr> 
          <th>Title</th> 
          <th>Size</th> 
         </tr> 
         <tbody id="tbodyid"> 
          <tr id="tr0"> 
           <td id="filetd0" height="10px" width="50px"></td> 
           <td id="filesizetd0" height="10px" width="5px"></td> 
          </tr> 
          <tr id="tr1"> 
           <td id="filetd1"></td> 
           <td id="filesizetd1"></td> 
          </tr> 
          <tr id="tr2"> 
           <td id="filetd2"></td> 
           <td id="filesizetd2"></td> 
          </tr> 
          <tr id="tr3"> 
           <td id="filetd3"></td> 
           <td id="filesizetd3"></td> 
          </tr> 
          <tr id="tr4"> 
           <td id="filetd4"></td> 
           <td id="filesizetd4"></td> 
          </tr>           
         </tbody> 
         <tfoot> 
          <tr> 
           <td id="filecount"></td><td id="totalsize"></td> 
          </tr> 
         </tfoot> 
        </table> 
       </div> 
      </td> 
     </tr> 
     <tr> 
      <td colspan="3"> 
       <button class="btn btn-primary" type="submit" id="startButton" onClick="CloseAndRefresh();">Start</button> 
       <button class="btn" id="cancelButton">Cancel</button> 
      </td> 
     </tr> 
    </table> 
</form>

codice UploadController.java:

@RequestMapping(value = "/upload", method = RequestMethod.POST) 
public void UploadReceipts(@RequestParam("files[]") List<MultipartFile> file) throws Exception { 
    logger.info(" Inside the upload receipts method "+file.size()); 
    for(int i=0; i< file.size(); i++) 
    { 
     if(!file.get(i).isEmpty()) 
     { 
      CommonsMultipartFile cm = (CommonsMultipartFile) file.get(i); 
      logger.info(" Inside the file upload method "+cm.getOriginalFilename()); 
      simpleUploadService.uploadFileandSaveReceipt(cm); 
     } 
    } 
}

fonte

2012-09-28 05:00:24

si può aggiungere un attributo multiple come questo:

<input type="file" multiple="true" />

fonte

2014-03-17 10:49:42 JudasPriest

Ricordarsi di inserire le parentesi nel nome name = "file []" –

Se si utilizzano più upload di file al modulo inviare

<input type="file" name="file[]" multiple>

crea una matrice di file e può ottenere facilmente il nome dei file da quella matrice.

fonte

2014-04-26 12:55:10 Sach

L'utilizzo della notazione della parentesi dipende da ciò che si sta eseguendo sul lato server e non è standard. In effetti, il modo standard per inviare campi di moduli duplicati con lo stesso nome è semplicemente inviarli senza parentesi. PHP, Rails e altri hanno deciso di fare cose non standard. – Brad

più file selezionare e caricare

risposta

Problemi correlati