2

我正在使用 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 #块显示错误的(原始)文件名。

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

4

1 回答 1

1

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

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

.filename模板中的元素在哪里:

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

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

于 2015-11-04T07:29:26.720 回答