Question

我不知道这是否是一个奇怪的案例，但我很难在网上找到类似的情况。

我在Kendo网格弹出编辑器模板中获得了Kendo上传控制（异步上传多个文件）。

我正在尝试实施以下行为：

用户可以从上传控件中选择多个文件，但尚未上传。
当用户点击默认＆＃34;更新＆＃34;弹出窗口的按钮，触发上传控件的异步上传操作。
如果用户点击＆＃34;取消＆＃34;按住或关闭窗口，不点击＆＃34;更新＆＃34;，窗口关闭，所选文件不上传。
成功上传所有文件后，将关闭弹出窗口并刷新网格。

我已经实现了上述功能而没有任何问题（即使我必须拦截许多Kendo Control的javascript）。

我的问题如下：

如果总文件大小（在DB +挂起的文件中）大于某个数量，那么作为服务器验证，我从服务器抛出异常，没有上传文件，并且<不应关闭strong>弹出窗口，同时弹出窗口中会显示错误消息。
如果用户到达上述点并选择其他文件，则先前选定的待处理文件将被清除，并且其行为就像一个全新的周期。
如果用户达到上述要点并点击＆＃34;取消＆＃34;按钮或点击＆＃34; X＆＃34;图标，窗口应该关闭。

我找不到简单的方法来实现它。

我能找到与此相关的是Upload in Grid Popup editor。

但是，它仍然没有显示我如何在前端捕获我自己的Exception，停止关闭窗口，并显示错误消息。

请提供任何建议！谢谢！

Answer 1

如何防止onUpload事件中的事件传播，并让你的窗口OnClose事件检查是否根据一些表明可以安全关闭的标志清除关闭。

@(Html.Kendo().Upload().HtmlAttributes(new { Style = "width:300px;" })
    .Name("upImport")
    .Messages(e => e.DropFilesHere("Drop files here").Select("Select file"))
    .Multiple(false)            
    .Async(a => a
        .Save("UploadFile", "File")
        .Remove("RemoveFile", "File")
        .AutoUpload(true)
        .SaveField("files")
    )    
    .Events(events => events
        .Error("onError")
        .Success("onSuccess")
        .Upload("onUpload")
    )
)

<script type="text/javascript">

var _canPost=true;

function onUpload(e) {
    _canPost=true; 
    var files = e.files;
    $.each(files, function () {
        if (this.size / 1024 / 1024 > 5) {
            alert("Max 5Mb file size is allowed!");
            e.preventDefault();
            //Block window from closing flag here 
            _canPost=false;
        }
    });
}

网格弹出编辑器中的剑道上传：如何在上传抛出异常时阻止窗口关闭

1 个答案: