Hello,
I am using the Kendo Upload widget to upload images to a web application. I am having some issues with file sizing even though my maximumfile size is set to 10 MB and the Image is 5.1 MB.
I was unable to find any information on built-in limitations for the uploader on in the Kendo UI jQuery documentation.
Are there any built-in limitations to this widget in terms of file size? If so, what are they?
Hi everybody.
Is it possible in JQuery KendoUpload to change the binary data before sending it to the server? Specifically pictures. We need to reduce the size of the image before sending it to the server. Does Kendo offer image resizing? Ideally in the upload?
Using this example: https://demos.telerik.com/kendo-ui/spreadsheet/server-side-import-export
I can't find the server-side script being run by this config: saveUrl: "/kendo-ui/spreadsheet/upload"
Where can I find this server-side script?
Hi..
When I upload file using kendo upload, it will hit the error event with response message "An asynchronous module or handler completed while an asynchronous operation was still pending.", but the file is successfully uploaded.
This only happen on the first time, subsequently is not getting the error anymore.
$("#files").kendoUpload({
async: {
saveUrl: "upload.aspx",
removeUrl: "remove",
autoUpload: true,
allowmultiple: true,
batch: true
},
localization: {
select: "Select Files"
},
complete: onComplete,
error: function (e) {
console.log(e);
},
select: function (e) {
},
dropZone: "#dropZoneElement",
showFileList: false
});
Hi
I have upload code similar to the below and was working till recently.
Error preventing the form from being posted. but no error detail from JavaScript.
This only happen using Chrome, file Firefox no issue.
No problem when posting without the rawfile.
Can anyone help?Thanks in advance.
<script>
$(
"#submitForm"
).on(
"click"
,
function
(e) {
e.preventDefault();
// Append the desired file
var
formData =
new
FormData();
var
upload = $(
"#files"
).getKendoUpload();
var
files = upload.getFiles();
formData.append(
'files'
, files[0].rawFile);
// Send the request
$.ajax({
url:
'index.php?type=save'
,
type:
'POST'
,
data: formData,
cache:
false
,
contentType:
false
,
processData:
false
,
success:
function
(response) {
console.log(response);
}
});
});
</script>
I have a requirement that each file should be assigned to a category. We also need to support multiple files upload. Is this possible using the kendo upload?
I know that I can add extra data but that is for the whole upload and not for each file
Hello all,
I have two issues adding the upload widget inside the grid.
1. I am trying to create a grid with an upload widget as one of its columns and make user be able to upload a file using drag&drop functionality.
The problem is that I could select file by the select button but drag&drop functionality is not working.
Below is my source data.
html:
<div id="grid1wrapper" class="row">
<div class="col-md-12">
<div id="grid1" kendo-grid="grid1" k-options="gridOptions" k-data-source="dataSource"></div>
</div>
</div>
javascript:
$scope.gridOptions = {
height: 500,
editable: true,
resizable: true,
navigatable: true,
columns: [
{
field: 'filename',
title: 'File Name'
},
{
title: 'File',
field: 'file',
attributes: { "class": 'text-center' },
editor: $scope.fileUploader,
width: 200
},
{
command: "destroy",
title: " ",
width: 40
}]
};
$scope.fileUploader = function(container, options) {
const name = options.field;
$('<input type="file" name="'+ name +'"/>')
.appendTo(container)
.kendoUpload({
multiple: false,
localization: {
dropFilesHere: "DropFilesHere"
}
});
};
2. After upload file and click another field to fill out the data, the uploaded file disappears and I cannot save file with save button.
Any idea?
Thank you.
Greetings. I am getting the following error while uploading a file with Kendo upload. Code works fine at local. But it gives this error on the server.
Error:
Client-Side Code:
$("#batchFile").kendoUpload({
async: {
saveUrl: '/DijitalArsiv/UploadFile/',
autoUpload: false
},
upload: function (e) {
if (uploadFileNode.isMainFolder) {
realPath = realPath + "\\" + personelID
}
e.data = { "id": uploadFileNode.id, "path": realPath, "isMainFolder": uploadFileNode.isMainFolder, "type": uploadFileNode.spriteCssClass };
},
select: function (e) {
if (e.files.length != 0) {
$.each(e.files,function (index, value) {
var filtredValue = acceptedFileTypes.filter(x => x == value.extension)
if (filtredValue.length == 0) {
e.preventDefault();
$("#message-alert").html("Sadece '.pdf', '.jpg', '.png', '.jpeg', '.docx', '.xlsx' türünde dosyalar yükelenebilir. Lütfen yüklediğiniz dosyların türünü kontrol edin.")
kendoWindowMessageAlertModal.data("kendoWindow").content($("#message-alert").html()).center().open();
}
})
}
},
success: function (e) {
if (e.response.Status) {
getTreeView().append([{ id: e.response.ID, text: e.response.FileName, spriteCssClass: e.response.Type, UnicParentCode: nodeToUploadParent.UnicParentCode, isDraggable: true, isDroppable: true, hasChildren: false, isEditable: false, isMainFolder: false }], nodeToUpload)
updateBackupTree();
} else {
e.preventDefault();
}
},
multiple: true,
batch: true,
localization: {
cancel: "Ä°ptal",
dropFilesHere: "Dosyalarınızı Buraya Sürükleyebilirsiniz!",
remove: "Sil",
retry: "Tekrar Dene!",
select: "Dosya Seç",
statusFailed: "Yükleme Başarısız!",
statusUploaded: "Yükleme Başarılı!",
statusUploading: "Yükleniyor...",
uploadSelectedFiles: "Yükle"
}
});
Server-side Code:
[HttpPost]
public JsonResult UploadFile(HttpPostedFileBase batchFile, int? id, string path, bool isMainFolder,string type)
{
}