ckeditortinymcerichtextboxdraftjsrte

How to really use RTE (Rich Text Editors) in your application?

Intro:

I am working at a project which contains a lot of forms and I'd like to integrate rich text editors for some fields.

Regarding the flow, it seems that behind the scenes your text from the editor is a in a specific format (e.g. HTML).

Problem:

As I want to save that information in a database, what is the best way to do it? For each RTE property to have 2 values stored: plaintext + formatted?

Another concern is how should I validate my formatted field?

I use mongoose for data storage and basically I want to apply my current schema on the plaintext, but in the future I want to serve the formatted field to client.

Your opinion

I found some online tools or libraries that offer also a community edition: react-rte, TinyMCE, Draft.js, CKEditor. Any recommendations or any suggestions regarding how to choose between them?

Solution

  • You can retrieve TinyMCE content as both HTML and plaintext.

    Let’s say you have initialized the editor on a textarea with id=”myTextarea”. First access the editor using that same id, then call getContent().

    var myContent = tinymce.get("#myTextarea").getContent();

    Or, instead of accessing the editor by id, you can access the active editor.

    var myContent = tinymce.activeEditor.getContent();

    These will both return the editor content marked up as HTML.

    To retrieve the content as plaintext, use getContent({format: 'text'}).

    Resources: