This is a migrated thread and some comments may be shown as answers.

Mobile platform HTML editing using KendoEditor with Xamarin.Forms.Webview.EvaluateJavaScriptAsync()

3 Answers 156 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Tony
Top achievements
Rank 1
Tony asked on 17 Oct 2019, 12:05 PM

Mobile platform HTML editing using KendoEditor with Xamarin.Forms.Webview.EvaluateJavaScriptAsync() 


<!DOCTYPE html>
<html>
<head>
    <link href="kendo.common.min.css" rel="stylesheet">
    <link href="kendo.rtl.min.css" rel="stylesheet">
    <link href="kendo.default.min.css" rel="stylesheet">
    <link href="kendo.default.mobile.min.css" rel="stylesheet">
    <script src="jquery.min.js"></script>
    <script src="jszip.min.js"></script>
    <script src="kendo.all.min.js"></script>
    <script src="console.js"></script>
    <script>

    </script>

</head>
<body>
    <div id="example">
        <textarea id="editor">Default text to be replaced</textarea>


        <script>
            $("#editor").kendoEditor({
                tools: [
                    "bold",
                    "italic",
                    "underline"
                ],
                resizable: {
                    toolbar: true
                }
            });
        </script>
    </div>    
</body>
</html>


When injecting the above KendoEditor script into the Xamarin.Forms.Webview.EvaluateJavaScriptAsync() after replacing the “Default text..” with an HTML string containing embedded Base64 images,  I am finding that it takes a long period of time before the editor is rendered.  The HTML contains 3 images each around 3Mb in size.  Loading the same HTML containing base64 images in a web application using the KendoEditor is a lot quicker.  Has anyone else used the KendoEditor in this way on the mobile platform, and can give any insight as to why the rendering is taking so long?

3 Answers, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 21 Oct 2019, 12:09 PM

Hello Tony,

We haven't tested the Editor in Xamarin environment, but if loading the images delays its rendering we would suggest loading them after it has been initialized with its value API method, for example:

var editor = $("#editor").data("kendoEditor");
editor.value(' <img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />');

 

Regards,
Ivan Danchev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Tony
Top achievements
Rank 1
answered on 30 Oct 2019, 10:32 AM
Following your advice above, the HTML editor is displaying very quickly.  However, I am finding that the code which injects the base64 images into the editor.value() has to be delayed for approx 1500ms otherwise an exception occurs. This is probably an issue with Xamarin.Forms.Webview.EvaluateJavaScriptAsync() but wanted to check if there is anyway of checking that the editor has been initialized prior to calling the editor.value()?   Thanks.
0
Ivan Danchev
Telerik team
answered on 01 Nov 2019, 09:23 AM

Tony,

You can check if the Editor has been initialized by checking whether you have a valid reference to it:

var editor = $("#editor").data("kendoEditor");

if(editor != undefined) {
  editor.value("<p>Some value</p>");
}

Regards,
Ivan Danchev
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Editor
Asked by
Tony
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Tony
Top achievements
Rank 1
Share this question
or