javascript - 剑道。上传。上传方法不会触发 onUpload 事件
问题描述
当 Kendo Upload 组件应该执行第二次上传时,不会触发 onUpload 事件处理程序。
我使用带有cropperjs(https://github.com/fengyuanchen/cropperjs/blob/master/README.md)的剑道上传来上传图像,裁剪然后发送到服务器。如果图像太大,服务器会发送错误消息。期望用户选择另一个裁剪区域并再次发送图像。在最后一步没有任何反应。
这里是裁剪图像和火上传的方法
cropper.crop();
var canvas = cropper.getCroppedCanvas();
canvas.toBlob(function (blob) {
image = blob;
$("#file").data("kendoUpload").upload();
});
然后在 onUpload 处理程序中,初始裁剪图像被裁剪图像替换。
e.data = {
file: image,
userName: $("#User_Login").val()
};
在服务器上向我发送一个错误:
public virtual ActionResult UpdateUserImage([FromBody]HttpPostedFileBase file, [FromBody]string userName)
{
try
{
ImageHelper.CheckImage(file);
}
catch (Exception e)
{
return new LargeJsonResult(new
{
error = e.Message,
})
{
StatusCode = HttpStatusCode.PreconditionFailed
};
}
...
}
错误在 onError 进程处理程序中处理:
var err = e.XMLHttpRequest;
if (err.status === 412) {
var body = JSON.parse(err.response);
alert(body.error);
}
else {
alert("Unable to upload the file. Please check that the
size is less than 10Mb.");
}
之后,允许用户裁剪已选择的图像。并且在更改裁剪区域后,预计将重复上述步骤。但是$("#file").data("kendoUpload").upload();
在第一个代码块之后没有任何反应。但是,我希望必须调用 onUpload 事件处理程序。
解决方案
我找到了解决方案 :) 我没有将图像发送到服务器并在那里检查大小,而是检查客户端的大小并在需要时阻止发送。我的意思是在打电话之前$("#file").data("kendoUpload").upload();
我打电话
if (image.size > 10 * 1024 * 1024) {
alert("File is too big!");
return;
}
一切都好。但是,如果有人仍然知道为什么$("#file").data("kendoUpload").upload();
不触发 onUpload 事件处理程序,那么与我分享想法会很棒:)
推荐阅读
- javascript - 如何对示例代码应用适当的事件处理甚至事件委托?
- c++ - 我如何记忆这个程序?
- sql - SQL 可以删除字段中的重复项而不是记录吗?
- python - 如何在 matplotlib 或 seaborn 中创建带有系列的堆叠条形图?
- ios - 自定尺寸视图在 UIStackView 中无法正确布局
- database - 雪花在 TIMESTAMP_NTZ 列中显示“无效日期”
- asp.net - 本地主机当前无法处理此请求
- python - 如何使用 Python 在地图上绘制可视化线串?
- ios - 异常的 APNS 离线行为
- design-patterns - java中数据聚合服务的代码重构