Kendo ImageEditor – How to Restrict Allowed File Types (PNG/JPG/WEBP Only)?

Progress® Kendo UI® for jQuery Feedback Portal

Create an account Log In

Request a Feature Report a Bug

Unplanned

Last Updated: 04 Dec 2025 13:43 by ADMIN

Amit

Created on: 01 Dec 2025 11:19

Category: ImageEditor

Type: Feature Request

Kendo ImageEditor – How to Restrict Allowed File Types (PNG/JPG/WEBP Only)?

Hi Telerik Team,

I’m using Kendo UI version 2022.3.1109 with jQuery, and I have implemented a Kendo UI ImageEditor in my application. I would like to restrict the allowed file types when users open an image from their device.

Goal
I want the ImageEditor to accept only a specific set of formats:

.png
.jpg/jpeg
.webp

Current Behaviour

When the user clicks the Open tool inside the Image Editor:

It allows all file types, including unsupported ones
There is no configuration option like the accept attribute available in Kendo Upload

I checked the documentation but could not find any built-in way to filter file types for the ImageEditor Open dialog.

Regards,
Amit

Attached Files:

1 comment

ADMIN

Viktor Tachev

Posted on: 04 Dec 2025 13:43

Hi Amit,

Your suggestion will be indeed a nice improvement for the ImageEditor widget. Thank you for submitting it.

Until this is planned and added to the pipeline, I would suggest overriding the internal method that initializes the upload component and adding the restrictions for it:

<script>
	kendo.ui.imageeditor.commands.OpenImageEditorCommand.fn.exec =
	  function () {
		var that = this,
		  imageeditor = that.imageeditor,
		  upload = imageeditor._upload;

		if (!upload) {
		  var input = $("<input type='file' accept='.png, .jpeg, .jpg, .webp' />",
		  );
		  input.kendoUpload({
			select: that.onSelect.bind(that),
			error: that.onError.bind(that),
			multiple: false,
			validation: {
			  allowedExtensions: [".png", ".jpg", ".jpeg", ".webp"],
			},
		  });

		  imageeditor._upload = upload = input.getKendoUpload();
		}

		upload.element.click();
	  };

</script>

For convenience, I have prepared a dojo where the approach is illustrated.

https://dojo.telerik.com/srTbnFog

Give it a try and let me know how it works for you.

Regards,
Viktor Tachev
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.