Search code examples
editorrich-text-editorquill

How to paste plain text in a Quill-based editor


Quill (https://quilljs.com/) makes it simple to embed a quality text editor in a web page. When pasting html content in the editor, it filters the pasted html and then puts it into the text editor. My question is: How can I configure Quill so it pastes only plain text in the text editor? It would filter out all tags and leave the plain text only.

The documentation about the Clipboard module (http://quilljs.com/docs/modules/clipboard/) says that it is possible to add custom Matchers to the Clipboard, that will kind of filter the pasted text.

I don't know how to write a matcher that only allows plain text. Any help and any examples are much appreciated - thanks!


Solution

  • After trial and error, I found the answer. The following matcher will cause the editor to paste plain text only:

    quill.clipboard.addMatcher (Node.ELEMENT_NODE, function (node, delta) {
        var plaintext = $ (node).text ();
        return new Delta().insert (plaintext);
    });
    

    It uses jQuery. :)