Kendo Editro custom tool

[JangHyen]

Hi !

I'm using the kendo editor in the Vue environment.

I want to create a Kendo editor Custom tool using the following template.

I would like to create a Kendo editor custom tool for file upload using the template below. The internal logic is in place and we just want to see an example of creating a custom tool with a template.

--

 <input class="hide_file" type="file" @change="doUploadInput($event.target)"
            @drop="doUploadInput($event.target)" multiple>
          </input>

--

This is well enough in the official documentation but I would like to see a more detailed example.

thank you. have a good day

: )

[Petar]

Hi JangHyen,

Check this StackBlitz example. It demonstrates how we can create an upload Editor tool out of a template.

The tool is defined as:

        <kendo-editor-tool :name="'customUpload'"
                           :tooltip="'Insert a horizontal rule'"
                           :template="customUpload">
        </kendo-editor-tool>

The template is defined as:

    <script type="text/x-kendo-template" id="upload-template">
          <input class="hide_file" type="file" @change="doUploadInput($event.target)"
            @drop="doUploadInput($event.target)" multiple>
          </input>
    </script>

and the definition of the customUpload method that returns the HTML of the above Kendo template is:

        customUpload () {
            return kendo.jQuery('#upload-template').html()
        }

Let me know if you have any questions regarding the proposed solution.

Regards,
Petar
Progress Telerik

[JangHyen]

This seems to work. thank you sir.

[Petar]

Hi JangHyen,

You are welcome. Let me know if have other questions related to this thread. 

Regards,
Petar
Progress Telerik