2017-05-19 89 views
1

我已经设置了kendo上传,如下所示。在kendo上传中按ID删除文件

@(Html.Kendo().Upload().Name("files") 
.Async(a => a 
    .Save("UploadAttachments", "Mycontroller") 
    .Remove("RemoveAttachments", "Mycontroller") 
    .SaveField("files") 
    .RemoveField("ids") 
    .AutoUpload(true)) 
.Events(e => e 
    .Success("onUploadSuccess") 
    .Error("onUploadError")) 
.Files(files => 
{ 
    foreach (var f in Model.Attachments) 
    { 
     files.Add().Name(f.FileName).Extension(Path.GetExtension(f.FileName)); 
    } 
})) 

UploadAttachments方法保存在服务器文件的文件并创建数据库记录并返回下面的模型

Id-long 
FileName: fileName 

RemoveAttachments方法预计IDS。在创建空的现有文件的过程中,我有以下事件处理程序更新文件,以便我可以使用ID删除。

function onUploadSuccess(e) { 
    if (e.operation == "upload") { 
     e.files[0].data = e.response[0]; // hold the attachment detail 
     e.files[0].name = e.response[0].Id; // change name with id so it can be passed to remove method 
    } 
} 

但与现有的文件,我想不出更新文件的方式或Model.Attachements的ID分配到上传控件。

我可以在init中设置带id的名字,但这样我就无法正确显示文件的名称。

foreach (var f in Model.Attachments) 
{ 
     files.Add().Name(f.Id.ToString).Extension(Path.GetExtension(f.FileName)); 
} 

这会在UI中显示错误的文件名。

回答

0

Kendo上传控件目前不支持这种行为。然而,使用当前版本实现它的一种方法是使用某种分隔符,在name属性后面添加id并覆盖控件中的内部_renderInitialFiles方法以正确检索名称和ID。您还可以使用remove事件将id而不是名称发送到服务器。

<div > 
    @(Html.Kendo().Upload() 
     .Name("files") 
     .Async(a => a 
      .SaveField("files") 
      .RemoveField("ids") 
      .Save("Save", "Upload") 
      .Remove("Remove", "Upload") 
      .AutoUpload(true) 
     ) 
     .Events(e=>e.Remove("fileRemove").Success("onUploadSuccess")) 
     .Files(files => 
     { 
       files.Add().Name("somename-someid").Extension(".txt"); 
     }) 
    ) 
</div> 

<script> 

    function assignGuidToFiles(files, unique) { 
     var uid = kendo.guid(); 

     return $.map(files, function (file) { 
      file.uid = unique ? kendo.guid() : uid; 

      return file; 
     }); 
    } 

    kendo.ui.Upload.fn._renderInitialFiles = function (files) { 
     var that = this; 
     var idx = 0; 
     files = assignGuidToFiles(files, true); 

     for (idx = 0; idx < files.length; idx++) { 
      var currentFile = files[idx]; 
      var delimiterIndex = currentFile.name.indexOf("-"); 
      currentFile.id = currentFile.name.substring(delimiterIndex + 1); 
      currentFile.name = currentFile.name.substring(0, delimiterIndex); 

      var fileEntry = that._enqueueFile(currentFile.name, { fileNames: [currentFile] }); 
      fileEntry.addClass("k-file-success").data("files", [files[idx]]); 

      if (that._supportsRemove()) { 
       that._fileAction(fileEntry, "remove"); 
      } 
     } 
    } 

    function onUploadSuccess(e) { 
     if (e.operation == "upload") { 

     } 
    } 

    function fileRemove(e) { 
     for (var i = 0; i < e.files.length; i++) { 
      e.files[i].name = e.files[i].id; 
     } 
    } 
</script>