kendo-ui - How can I strip all html formatting from text when pasting into KendoUI Editor?

Question

I want to use KendoUI editor to basically only allow users to format text into paragraphs. Possibly allow bold and underline.

I'm struggling with 2 things:

1. I want to strip all html formatting from text when pasting
2. I want to disable keyboard shortcuts for bold, underline etc - they seem to work even when toolbar element is not there.

Thanks!

Answer 1

For pasting the only the text you might define a paste handler that remove all but text. This is as simple as:

$("#editor").kendoEditor({
    paste: function (ev) {
        ev.html = $(ev.html).text();
    }
});

The paste handler receives as argument an event that has in html the text being parsed. We can use jQuery for getting only the text using $(ev.html).text()

For removing the shortcuts, and as far as I could test it with latest Kendo UI version, if you define only the tools that you want, only those shortcut are active. So if you say something like:

$("#editor").kendoEditor({
    tools: [
        "italic"
    ],
    paste: function (ev) {
        ev.html = $(ev.html).text();
    }
});

Only italic shortcut <ctrl>+i is available. If you leave tools array empty then you do not have any.

Answer 2

This can be easily achieved now with pasteCleanup option.

See here: http://docs.telerik.com/kendo-ui/controls/editors/editor/pasting

Answer 3

Kendo MVC has also extension for this purpose. Example of usage:

.PasteCleanup(x => x.KeepNewLines(false))

false in this case means that you want to clear everything except new lines.

Answer 4

for me this is the complete solution

                pasteCleanup: {
                custom: function (html)
                {
                    html = html.replace(/<\s*br\/*>/gi, '');
                    html = html.replace(/<\s*a.*href="(.*?)".*>(.*?)<\/a>/gi, " $2 (Link - $1) ");
                    html = html.replace(/<\s*\/*.+?>/ig, '');
                    html = html.replace(/ {2,}/gi, '');
                    html = html.replace(/\n+\s*/gi, '');
                    html = html.replace("&nbsp;", '');
                    html = html.replace(/&lt;.*?&gt;/g, '');
                    return html;
                }
            }