Kendo MVC上传-批上传

Question

我使用Kendo上传控件一次上传多个文件(即批处理)。文档很清楚该做什么，但是我看到每个文件都有单独的上传请求，而不是对所有文件的单个上传请求。

这是我的上传控制代码

 Html.Kendo().Upload().Name("files")
     .TemplateId("fileUploadTemplate")
     .Events(e =>
      {
         e.Upload("onFileUpload");
      })
      .HtmlAttributes(new { accept = ".xls,.csv" })
      .Messages(m => m.Select("Select Files..."))
      .Async(a => a.Save("Upload", "Home").AutoUpload(false).Batch(true))

我使用kendo模板对每个上传的文件再添加两个字段(开始和结束日期)，如下所示。

​

​

这是模板代码。

<script id="fileUploadTemplate" type="text/x-kendo-template">
      #var fileCount = $(".k-file .row").length;#
      #var startId = 'PeriodStart_' + fileCount; #
      #var endId = 'PeriodEnd_' + fileCount; #

      <span class="k-progress"></span>
      <div class="row">
        <div class="col-md-4">
          <span class="k-filename"><strong>#=name#</strong></span>
        </div>
        <div class="col-md-3 nopadding">
          Start: @(Html.Kendo().DatePicker().Name("#=startId#").ToClientTemplate())
        </div>
        <div class="col-md-3 nopadding">
          End: @(Html.Kendo().DatePicker().Name("#=endId#").ToClientTemplate())
        </div>
        <div class="col-md-1 text-right">
          <button type="button" class="k-upload-action"></button>
        </div>
   </div></script>

下面是事件处理js代码，它收集每个文件的开始和结束日期，并构造一个json对象与多个文件一起发送到后端。

function onFileUpload(e) {
    var fileInfo = getUploadFileMetaData();        
    var modelAsJson = JSON.stringify(fileInfo);
    console.log(modelAsJson);
    e.data = {
        modelAsJson: modelAsJson
    };
}
function getUploadFileMetaData() {
    var numOfFiles = $(".k-file .row").length;
    var fileInfoArray = [];
    for (var i=0; i<numOfFiles;i++){
        var fi = {
            FileName: $(".k-filename strong")[i].innerText, //Filename is required as is since it'll be our key
            PeriodStart: $("#PeriodStart_" + i).data('kendoDatePicker').value(),
            PeriodEnd: $("#PeriodEnd_" + i).data('kendoDatePicker').value()
        }
        fileInfoArray[i] = fi;
    }
    return fileInfoArray;
}

因此，如果我选择两个文件上传，我将看到两个不同的请求触发到Controller，而不是1。我肯定我没有看到一些直接的东西，欣赏任何显示和告诉。

Answer 1

我在Telerik论坛上找到了答案。

显然这是不可能的。只有当用户一次选择多个文件(Ctrl + Select)时，才可能采用批处理操作模式，而不是当用户通过多次单击select files按钮一个接一个地选择这些文件时。把它放在另一种方式，批处理模式是可能的，只有当上传控件有1行项目-无论是一个或更多的文件。

这里有更多的细节- http://www.telerik.com/forums/batch-mode---not-working

Answer 2

我已经设法使Kendo上传完美地在批处理模式下工作。基本上，您可以将所有文件上传到浏览器，然后正常提交表单，并将它们上传到服务器和/或同时删除。

这里有更多详细信息：https://kolaberate.com/Articles/2019/08/29/implementing-batch-mode-using-kendo-upload-control-for-asp-net-core/