How to get the plain text from summernote editor?

Question

for example, this is what I entered:

sdf
42342
xxcv

.code() converts it to sdf<br>42342<br>xxcv

or another thing:

[{"_type":"ServerOperation","operationType":"ANNOUNCE"}]

becames

<span class="message_content">[{"_type":"ServerOperation","operationType":"ANNOUNCE"}]</span>

how to get the pure / plain text?

Crossbill

Answer 1

You could apply one of the top two answers for the question JavaScript: How to strip HTML tags from string?, after the .code() to strip the tags.

ReactiveRaven's answer (to keep it to one line) works fine for me:

cleanText = $("#summernote").code().replace(/<\/?[^>]+(>|$)/g, "");

For example, With [{"_type":"ServerOperation","operationType":"ANNOUNCE"}]:

• $("#summernote").code() returns

  <p>[{"_type":"ServerOperation","operationType":"ANNOUNCE"}]<br></p>

• $("#summernote").code().replace(/<\/?[^>]+(>|$)/g, "") returns

  [{"_type":"ServerOperation","operationType":"ANNOUNCE"}]

  without any tags.

---

And if you want to preserve the carriage return, you could replace </p> and <br> for a \n before applying the solution specified on the linked question:

$("#summernote").code()
                .replace(/<\/p>/gi, "\n")
                .replace(/<br\/?>/gi, "\n")
                .replace(/<\/?[^>]+(>|$)/g, "");

Whiles

yes, in the meantime I solved it with php's striptag – Crossbill

Answer 2

Just try this:

var plainText = $($("#summernote").code()).text()

EDIT: In newer versions you need use this instead:

var plainText = $($("#summernote").summernote("code")).text()

Pettus

Formidable, and avoid regex on hmtl. This must be the accepted answer! – Isagoge

your answer might return a empty string. $('<textarea />').html($("#summernote").summernote("code")).text() is better! – Geralyngeraniaceous

Answer 3

I needed to check if the textarea had any content. This have done the trick:

Current summernote version (8):

$($("#summernote").summernote('code').replace(/&nbsp;|<br>/g, ' ')).text().trim() == ''

In my older version:

$($("#summernote").code().replace(/&nbsp;|<br>/g, ' ')).text().trim() == ''

Personalism

This is useful but it would not work as is. I had to change ".code()" to ".summernote('code')" for it to work properly. – Stavanger

In the current version, it appears to be as @AustinBest said. Here: hub.readthedocs.io/en/stable/assets/global/plugins/… I found it my way in an older version. I believe the summernote API has changed, but I do not know in wich specific version. – Personalism

Answer 4

you can use this

   var code = $("#editor").code();
var text = code.replace(/<p>/gi, " ");
var plainText= $("<div />").html(text).text();

Insecticide

It is very important to wrap the content by a div like what you're doing here $("<div />").html(text).text();. Because if you the content of summernote contain some plain text and you don't wrap the whole content inside an HTML tag(like div) then, jQuery will through an error saying it was not expected. – Mothball

Answer 5

newer versions

var contents = $('#summernote').summernote('code');
var plainText = $("<p>" + contents+ "</p>").text();

Adding a dummy tag

resolves the lack of formatting.

Slurry

Answer 6

For version 0.8.20:

If you want the actual text, without any of Summernote's styling (bold, italic etc.) and without any linebreaks:

$("<div />").html($("#summernote").summernote("code")).text();

If you want the text, Summernote's styling and linebreaks:

$("<textarea />").html($("#summernote").summernote("code")).text();

Palaver

Answer 7

Try This :)

$('#summernote').summernote ('code', '<b> hello world </ b>');

Fallingout

The question is how to get the text and about inserting the text – Technique