Questions on Kendo UI for jQuery Forum

1 answer

33 views

Kendo UI for jQuery - Need client-side library path for libman.json

Hi,

I have created .net core project and imported Kendo UI jQuery files from the given path and placed them in my project's js path along with trial license key .js file. But I need to invoke "kendo.all.min.js", "kendo-ui-license.js" using client-side library path for libman.json. If it is possible to invoke then please guide me with client-side library settings. And also let me know how to take the actual license instead of trial license.

Thanks,

Dhirendra

ImageEditor

answered on 20 May 2025

1 answer

95 views

Kendo UI Jquery - Image Editor Crop Default Sepcified

Hello,

when i open image on kendo editor from file upload then by default it's show selected as crop with default aspect ratio i have specified one
and also want to hide following from crop dialog -

- hide aspect ratio dropdown field
- hide orientation
- hide lock aspect ratio

only confirm and cancel button should show on crop dialog

so basic purpose it user will crop the image of required aspect ratio only no other option to be given to user.
also post crop we need to validate image size should not be more than 10MB

I am using kendo version 2024.1.130

Thanks!

ImageEditor

answered on 10 Feb 2025

1 answer

78 views

Insert Image tool does not insert image at current position.

Hii,

I am using Kendo version Kendo UI v2020.2.617 in our project, and while using insertImage tool from the editor I am facing some issues.

Following are the issues I faced -

1. When I select the insertImage tool and try adding an image at a certain position, it jumps to the top of the editor (Once in multiple try it sticks at a certain position).

2. insertImage tool does not render images from all URLs. I entered multiple URLs but only on some URLs I got an image rendered.

I have attached the screenshot above regarding the issue where once the image is rendered at the last position else it is rendered at the top.

Will you please help me out with possible ways to fix this?

Thank you,

Sameep Sawant

ImageEditor

answered on 20 Feb 2024

2 answers

214 views

How to programmatically resize a picture with the ImageEditor

Based on this link we want to use the resize Command to downscale an uploaded picture

https://docs.telerik.com/kendo-ui/api/javascript/ui/imageeditor/methods/executecommand#executecommand

Something like

imageEditor.executeCommand({ command: "ResizeImageEditorCommand", options: {height: 1080, aspectRatio: true } });

How could this be realised

best regards

Maik

ImageEditor

answered on 16 Oct 2023

0 answers

112 views

Kendo ImageEditor canvas support in jquery

Hi, are there any demo counterparts in jquery of canvas mode in asp.net?

https://demos.telerik.com/aspnet-ajax/imageeditor/examples/canvassupport/defaultcs.aspx

so basically we want to edit an image adding text, line and such.

ImageEditor

updated question on 06 Mar 2023

0 answers

220 views

Image Editor i.toolbar.enable is not a function

When utilizing an image editor control I receive the following output in console and the image does not load: Please see markup below

Html Page Div Implementation

Html Page Script Implementation

Console output

Result of View

My Layout has the following implementations for CSS and JS

ImageEditor

asked on 16 Jan 2023

1 answer

200 views

Pagination in ImageBrowser of Kendo Editor

Hello,

I am working with application where I have thousands of images to load on ImageBrowser of Kendo Editor.

ImageBrowser is getting stuck as having too many images to load, Can we have any option to add pagination or lazy loading in ImageBrowser?

So, I can load only 20 images at a time and other based on request.

Please note that I am fetching images from controller method which returns list of FileBrowserEntry as below.

Thanks,

Trusha

answered on 29 Jun 2022

0 answers

243 views

Kendo Image Editor Error in Kendo Window. Please help me.

I don't know what happend with my Kendo Image Editor. It add more Kendo Image Editor to Kendo Window.

I only transmit one link from the data source.

My Json in data source only has 1 link, but when I open kendo window, it crashes.

When it call dataSourceGetImageUrl.read(); it will add new one more kendo Editor

Info in my image: https://ibb.co/hcx2ck7

My code:

var dataSourceGetImageUrl = new kendo.data.DataSource({
        
        transport: {
            read: function (options) {
                $.ajax({
                    url: "/_layouts/15/VuThao.TrainSharepoint/API/ApiHandler.ashx?tbl=like&func=getimageurl",
                    type: 'GET',
                    cache: false,
                    scriptCharset: "utf8",
                    dataType: "json",
                    data: {
                        models: kendo.stringify(options.data.models)
                    },
                    success: function (result) {
                        options.success(result);
                    }
                });
            },
        },
        schema: {
            data: 'data',
            model: {
                id: "imageUrl"
            }
        },
        change: function (e) {
            var view = dataSourceGetImageUrl.view()[0].imageUrl;
            $("#imageEditor").kendoImageEditor({


                imageUrl: view,
                width: "100%",
                height: 650,
                saveAs: {
                    fileName: "image_edited.png"
                }
            });

            var imageEditor = $("#imageEditor").getKendoImageEditor();
            imageEditor.one("imageRendered", function () {
                imageEditor.executeCommand({ command: "ZoomImageEditorCommand", options: imageEditor.getZoomLevel() - 0.2 });
            });
        }
    });

Every time execute:

dataSourceGetImageUrl.read(); //it will add kendo image editor one more time

I'm really tired, can anyone help me to solve it

Data Source

ImageEditor

updated question on 14 May 2021

0 answers

190 views

How to "new kendo.data.DataSource" can use "autoBind: false". And can call .read()

Hi Admin and everybody,

I am working with dataSource for Image Editor.

I completed get data and give it for Kendo Image Editor.

But, I cannot use it with "autoBind: false" to stop load when start page like Title or call it with .read().

This is my code:

var dataSourceGetImageUrl = new kendo.data.DataSource({
        transport: {
            read: function (options) {
                $.ajax({
                    url: "/_layouts/15/xxx/API/ApiHandler.ashx?tbl=like&func=getimageurl",
                    type: 'GET',
                    cache: false,
                    scriptCharset: "utf8",
                    dataType: "json",
                    data: {
                        models: kendo.stringify(options.data.models)
                    },
                    success: function (result) {
                        options.success(result);
                    }
                });
            },
        },
        schema: {
            data: 'data',
            model: {
                id: "imageUrl"
            }
        }
    });

    dataSourceGetImageUrl.fetch(function () {
        var dataSource = dataSourceGetImageUrl;
        var view = dataSourceGetImageUrl.view()[0].imageUrl;
        $("#imageEditor").kendoImageEditor({
            autoBind: false,     //It not working.It still read when my page start

            dataSource: dataSource,
            imageUrl: view,
            width: "100%",
            height: 650,
            saveAs: {
                fileName: "image_edited.png"
            }
        });

        var imageEditor = $("#imageEditor").getKendoImageEditor();
        imageEditor.one("imageRendered", function () {
            imageEditor.executeCommand({ command: "ZoomImageEditorCommand", options: imageEditor.getZoomLevel() - 0.2 });
        });
    });

I tried call .read() with code. But it not working

$("#imageEditor").data("kendoImageEditor").dataSource.read();

//OR

dataSourceGetImageUrl.read(); // All both not working. I cannot call .read() to reload

dataSourceGetImageUrl

Hope to get help soon from everyone. Thanks

Data Source

ImageEditor

updated question on 13 May 2021

0 answers

209 views

How to read imageUrl in Kendo ImageEditor with dataSource

Hi Admins and everybody

I want to read imageUrl of Kendo ImageEditor using dataSource + TRANSPORT WITH FUNCTION

But It don't show. What wrong with my code. I have to image show json data in url

My code:

var dataSourceGetImageUrl = new kendo.data.DataSource({
        transport: {
            read: function (options) {
                $.ajax({
                    url: "/api/handler.ashx?tbl=like&func=getimageurl",
                    type: 'GET',
                    cache: false,
                    scriptCharset: "utf8",
                    dataType: "json",
                    data: {
                        models: kendo.stringify(options.data.models)
                    },
                    success: function (result) {
                        options.success(result);
                    }
                });
            },
        },
        schema: {
            data: 'data'
        }
    });
   
    $("#imageEditor").kendoImageEditor({
        dataSource: dataSourceGetImageUrl,
        width: "100%",
        height: 650,
        saveAs: {
            fileName: "image_edited.png"
        }
    });

    var imageEditor = $("#imageEditor").getKendoImageEditor();
    imageEditor.one("imageRendered", function () {
        imageEditor.executeCommand({ command: "ZoomImageEditorCommand", options: imageEditor.getZoomLevel() - 0.2 });
    });

What I need to fix it? Hope Admin and eeverybody help me. Thanks.

ImageEditor

updated question on 12 May 2021