如何将自定义工具添加到 kendo 编辑器

Question

如何将自定义工具添加到 kendo editor toolbar？

我想添加拼写检查器，媒体管理器和从 word 剪切、复制、粘贴和剪切、从 word 复制以及其他一些工具。

我在 MVC 应用程序中使用 Kendo 编辑器。

Answer 1

我正在使用自定义工具在应用程序中添加 link 引用，方法是从现有的引用中搜索它们。

这是从我的来源中截取的代码

@(Html.Kendo()
                  .Editor()
                  .Name("Content")
                  .Tools(tools => tools
                      .Clear()
                      .Bold().Italic().Underline().Strikethrough()
                      .JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
                      .InsertUnorderedList().InsertOrderedList()
                      .Outdent().Indent()
                      .CreateLink().Unlink()
                      .InsertImage()
                      .SubScript()
                      .SuperScript()
                      .TableEditing()
                      .ViewHtml()
                      .Formatting()
                      .CleanFormatting()
                      .FontName()
                      .FontSize()
                      .FontColor()
                      .BackColor()
                      .CustomButton(cb => cb
                          .Name("Add link to article")
                          .ToolTip("Add link to article")
                          .Exec("execFunction")
                      ))
                      .Encode(false)
                      .ImageBrowser(imageBrowser => imageBrowser
                             .Image("~/Content/Uploads/Images/{0}")
                             .Read("Read", "ImageBrowser")
                             .Create("Create", "ImageBrowser")
                             .Upload("Upload", "ImageBrowser")
                             .Thumbnail("Thumbnail", "ImageBrowser")))

这些是我对编辑器的配置。我认为您只对 .CustomButton(cb => cb.Name / 这是必要的/ cb.Exec / 也是必要的 / 感兴趣。在 Exec 中，您传递单击按钮时应执行的 JS 函数的名称。你可以用 ajax 连接你的 JS 到你的控制器。我会和你分享我的。

function execFunction(e) {
        $.get('/Articles/BuildLinkView', null, function(data) {
            $('#addLinkHolder').html(data);
            $('#addLinkHolder').css('display', 'table-cell');
        });
    }

当你将它绑定到控制器时，你可以用它做任何你想做的事情。

希望这能解决您的问题。如果没有，请提供更多信息

如何将自定义工具添加到 kendo 编辑器

How to add Custom tools to kendo editor

asp.net-mvc

customtool

kendo-asp.net-mvc

kendo-editor