New to Kendo UI for jQueryStart a free 30-day trial

Set Size Limit for Images Uploaded with Editor ImageBrowser

Environment

ProductProgress® Kendo UI® Editor for jQuery
Operating SystemAll
BrowserAll
Preferred LanguageJavaScript

Description

How can I set a size limit for the images that are uploaded with the ImageBrowser of the Editor?

Solution

  1. Check the size of the selected file in the select event handler of the Upload that is embedded in the ImageBrowser.
  2. Prevent the upload if the file size exceeds the specified limit.
<script>
	$(document).ready(function () {
		// Attach a click handler to the ImageBrowser tool of the Editor.
		$(".k-i-image").click(function () {
			setTimeout(function(){
				// Attach a select handler to the Upload embedded in the ImageBrowser.
				$(".k-imagebrowser .k-upload").find("input").data("kendoUpload").bind("select", function (e) {
					// Prevent the event if the selected file exceeds the specified limit.
					if (e.files[0].size > 1048576) {
						e.preventDefault();
						alert("Maximum allowed file size: 1MB");
					}
				});
			});
		});
	});
</script>
In this article
EnvironmentDescriptionSolution
Not finding the help you need?
Contact Support