Kendo UI 在服务器上上传重命名文件并更新客户端答案

【问题标题】：Kendo UI Upload rename file on server and update clientKendo UI 在服务器上上传重命名文件并更新客户端
【发布时间】：2015-11-03 20:56:32
【问题描述】：

我正在使用 Kendo UI 上传小部件，并在服务器上重命名上传的文件。我返回文件的新名称并在成功事件中修改文件名，但这并没有完全更新文件名。我的意思是，例如，删除发送到服务器的上传文件的链接具有正确的文件名，但我用来显示上传文件详细信息的模板却具有原始文件名。

小部件配置：

<input type="file"
       name="file"
       data-role="upload"
       data-template="fileTemplate"
       data-multiple="false"
       data-async="{ saveUrl: 'uploadFile', removeUrl: 'removeFile', autoUpload: true } "
       data-bind="events: { success: uploadSuccess } " />

服务器响应：

[text/plain]
{ "fileName": "89sd0adf0das9fdsa9.jpg" }

查看模型：

var viewModel = kendo.observable({
    uploadSuccess: function (e) {
        // Not sure this is the correct way to accomplish this
        e.files[0].name = e.response.fileName;
    }
});

模板：

<script id="uploadTemplate" type="text/x-kendo-template">
    <span class='k-progress'></span>
    <div class='file-wrapper'>
        File name: #= name # <br/>
        <button type='button' class='k-upload-action'></button>
    </div>
</script>

.k-upload-action 按钮（带有删除文件的链接）将正确的文件名发送到服务器，但 File name: #= name # 块显示错误的（原始）文件名。

不确定我修改文件名的方式是否正确。有谁知道如何正确更新文件名绑定或者我是否缺少步骤（以某种方式更新使用的模板）？

【问题讨论】：

标签： kendo-ui kendo-upload

【解决方案1】：

您必须手动更新文件名，例如

uploadSuccess: function (e) {
    $(".filename").text(e.response.fileName);
}

其中.filename 是模板中的一个元素：

File name: <span class="filename">#= name #</span> <br/>

这是一个现场演示：http://dojo.telerik.com/@korchev/EGuXi

【讨论】：