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

Question

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

小工具配置：

<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 #块显示错误的（原始）文件名。

不确定我修改文件名的方式是否正确。有人知道如何正确更新文件名绑定吗？或者我是否错过了一个步骤（以某种方式更新所使用的模板）？

Answer 1

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

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

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

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

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