I'm using kendo-ui upload, I want to filter file (only allow choose .jpg, .png), but I don't know to implement in javascript, please help me!
1- .cshtml file
<input name="files" id="files" type="file" />
2- JavaScript
$(document).ready(function () {
$("#files").kendoUpload({
multiple: false,
async: {
saveUrl: "Home/Save"
}
});
});
要过滤文件,请执行以下操作:
<input name="files" id="files" type="file" accept=".jpg,.png"/>
Specify a 'select' event handler when you initialise your kendo upload widget:
$(document).ready(function () {
$("#files").kendoUpload({
multiple: false,
async: {
saveUrl: "Home/Save"
},
select: onSelect,
});
});
Then use this to handle the file select event:
function onSelect(e) {
var files = e.files
var acceptedFiles = [".jpg", ".jpeg", ".png", ".gif"]
var isAcceptedImageFormat = ($.inArray(files[0].extension, acceptedFiles)) != -1
if (!isAcceptedImageFormat) {
e.preventDefault();
alert("Image must be jpeg, png or gif");
}
}
You have to use OnSelect Event for that and restrict the count you want to.
http://docs.kendoui.com/api/web/upload#select
http://demos.kendoui.com/web/upload/events.html
function onSelect(e) {
if (e.files.length > 1) {
alert("Please select only 1 file.");
e.preventDefault();
}
}
add validation to the input file options us below:
validation: {
allowedExtensions: [".gif", ".jpg", ".png"]
}
check this demo if you are looking for more : https://demos.telerik.com/kendo-ui/upload/validation
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.