javascript - Kendo 在初始文件选择后上传复制文件

Question

我们正在使用 Telerik ASP.NET MVC VSExtensions 2019.1.116.1 并有一个使用上传控件的 MVC 应用程序。我们面临的问题是我们第一次打开上传控件并从文件资源管理器中选择一个文件时，它正在复制控件中的所选文件。

我们正在使用异步选项，它会去我们的 Controller 一次处理文件，但它会显示同一个文件两次。它在第一个文件上将状态设置为成功，但它永远不会关闭，因为上传图标一直显示并且“第二个”文件永远不会发送到 Controller 。

如果我们关闭这个控件然后重新点击按钮打开控件并选择一个文件，它只显示一次文件并调用 Controller 处理文件并按预期工作。

此外，如果我们重新加载页面然后使用拖放操作，它会按预期工作，因此只有在我们第一次加载页面并单击“选择文件”按钮时，它才会复制显示的文件。

我们为上传控件和关联的文本/按钮使用隐藏的“div”，然后我们有一个显示该 div 的按钮。

<div id="cdpUploadScheduleEvents" style="display: none; border-style:solid">
    <p class="panel panel-info">
        Please select the file.
    </p>
    @(Html.Kendo().Upload().Name("files"))

    <div style="width: 15%; margin: auto;">
        <button id="closeUploadBtn"class="button btn4 center-block btn-block" onClick="CloseUploadPane()">Close</button>
    </div>
</div>

我们在$(document).ready中初始化kendo控件:

     $("#files").kendoUpload({
            multiple: false,
            async: {
                saveUrl: '@Url.Action("UploadFile", "MyCtl", new {masterId = @Model.masterId})',
                removeUrl: '',
                autoUpload: true
            },
            error: onKendoError,
            complete: onKendoComplete,
            upload: onKendoUpload,
            select : onKendoSelect,
            validation: {
                allowedExtensions: [".csv", ".xls", ".xlsx"]
            }
        });

这是我的 OnSelect，我在那里有一个显示文件数量的警报，它总是显示 1 个文件被选中:

 function onKendoSelect(e) {
        var selectedFiles = e.files.length;
        alert('Files selected ' + selectedFiles);
        if (selectedFiles > 1) {
            $(".k-upload-files > li:eq(1)").remove();
        }
    };

不确定为什么第一次使用该控件时它会重复，之后每次如果功能正常，或者为什么拖放操作每次都能正常工作。

Answer 1

您正在两次初始化上传小部件。我想这就是它表现如此奇怪的原因。只需将所有初始化放入 Razor 代码中，然后从 $(document).ready 中删除这些内容。