Загрузка нескольких файлов с использованием AJAX

Я работаю над webapp, и я использую загрузку нескольких файлов, но он не работает с AJAX. Для загрузки нескольких файлов я использую Apache FileUpload, который работает отлично, но после использования Ajax ServletFileUpload.isMultipartContent() возвращает False.Загрузка нескольких файлов с использованием AJAX

Спасибо за вашу помощь

Вот мой JSP код:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>Envoi des fichiers RNP</title> 
     <script src="js/jquery-1.11.3.min.js"></script> 
     <script src="js/fileupload.js"></script> 

     <link type="text/css" rel="stylesheet" href="css/form.css"> 
    </head> 
    <body> 
     <form id="myForm" > 
      <fieldset> 
       <legend>Envoi de fichier</legend> 
       <label for="fichier">Emplacement du premier fichier <span class="requis">*</span></label> 
       <input type="file" id="fichier" name="fichiers[]" multiple value="<c:out value="${fichier.nom}"/>"/> 
       <span class="erreur">${form.erreurs['fichier']}</span> 
       <br /> 
       <br /> 
       <input type="submit" value="Envoyer" id="showTable"/> 
       <br /> 
      </fieldset> 
     </form> 
     <div id="tablediv"> 
      <table cellspacing="0" id="site2G"> 
       <tr> 
        <th scope="col">CGI</th> 
        <th scope="col">BSC</th> 
        <th scope="col">Site Name</th> 
        <th scope="col">Cells</th> 
        <th scope="col">EA</th>   
       </tr> 
      </table> 
     </div>  
    </body> 
</html>

и мой AJAX код:

$(document).ready(function() {$("#tablediv").hide(); 
$("#myForm").submit(function(event){ 
    event.preventDefault(); 

    var formData = new FormData($(this)[0]); 

    $.ajax({ 
      url: "Upload", 
      type: 'POST', 
      data: formData, 
      async: false, 
      cache: false, 
      contentType: false, 
      processData: false, 
      success: function(responseJson) { 
       if(responseJson!=null){ 
        $("#site2G").find("tr:gt(0)").remove(); 
        var table1 = $("#site2G"); 
        $.each(responseJson, function(key,value) { 
         var rowNew = $("<tr><td></td><td></td><td></td><td></td><td></td></tr>"); 
          rowNew.children().eq(0).text(value['bsc']); 
          rowNew.children().eq(1).text(value['sitename']); 
          rowNew.children().eq(2).text(value['cells']); 
          rowNew.children().eq(3).text(value['cgi']); 
          rowNew.children().eq(4).text(value['ea']); 
          rowNew.appendTo(table1); 
        }); 
        } 
       } 
      }); 
     $("#tablediv").show();}); });

источник

2015-07-23 salma.f

Вы должны проверить в закладке сети этих файлы становятся загруженной или нет. – Jai

Вы можете предпочесть плагины сторонних разработчиков, чтобы загрузить несколько файлов на сервер

Несколько, которые я порекомендую, это

Они поддерживают

множественную загрузку файлов.

прогресс бар

что делать после того, как файл был успешно загружен

просмотр изображения

источник

2015-07-23 09:57:24

_ По соображениям безопасности вы не можете использовать jquery ajax_, как это сделать? Где вы его нашли? Разве вы не знаете, что это возможно с помощью 'FormData() + jQuery.ajax()'? – Jai

@Jai Нет, я этого не знал, и я googled это да, возможно .. и я отредактировал свой ответ ... извините за неправильную информацию –

и только с ** html5 **. – Jai

Я использовал следующую функцию для загрузки

$.upload = function(url, form, _callback) { 
    $.ajax({ 
     url: url, 
     type: "POST", 
     processData:false, 
     cache: false, 
     async: true, 
     data: form, 
     contentType: false, 
     success:function(data, textStatus, request){ 
      if(typeof _callback == "function") 
       _callback.call(this, data); 
     }, 
     error:function(data, textStatus, request){ 
      if(typeof _callback == "function") 
       _callback.call(this, data); 
     } 
    }); 
};

Для вызова этой функции

var formData = new FormData(); 
for(var i=0;i<$("#upload #file").get(0).files.length;i++) 
    formData.append("file" + i, $("#upload #file").get(0).files[i]); 


$.upload("Upload", formData, function(data){ 
    //success or failure check 
});

Ваш HTML является

<form id="upload" style="display:none"> 
    <input name="file" id="file" type="file" multiple /> 
</form>

источник

2015-07-23 10:04:50

выпуск - другой. в файле есть атрибут 'multiple'. – Jai

также можно выполнить цикл через файлы [i] и присвоить имена добавлению с уникальными именами полей, такими как file1, file2, file3 –

Загрузка нескольких файлов с использованием AJAX

ответ

Смежные вопросы