How does stackoverflow format textarea when click edit button?

Question

This is not a duplicate question, i know how to create a rich editor, but i meet problems

I want to make a rich text box like stackoverflow does.

1. I import the wmd plugin just like SO.

2. When i save a topic to mysql, it saves the processed text like this:

< p>hello world< /p>

< pre >< code >class Text {} < /code >< /pre >

This is normal i think because the html page can render this correctly.

But When i try to edit this topic, it directly shows the code in my textarea:

What i need is this(Just like the first time i entered):

My textarea code is very simple like this:

<!-- text area start -->
      <div id="wmd-button-bar"></div>
      <textarea id="wmd-input" name="description" onblur="checkForm()">${topic?.description}</textarea>
      <div id="wmd-preview"></div>
<!-- text area end -->

Anyone can help ? Thanks.

Ecumenism

Can you please show us the code what you have tried with? – Unregenerate

possible duplicate of How to create a rich text editor – Brag

This is not a duplicate question, i know how to create a rich editor, here i want to know why i meet this problem. – Ecumenism

You see what you see because that's what you saved. SO doesn't do anything magic, it just takes your text and persists it as-is. – Opaline

You must not have something interpreting the HTML tags when loading it into the textarea from the database. While you may have a rich text editor in place for when you create from the textarea, without having it interpret existing input onload: it won't format that text. – Headpiece

Answer 1

I find the answer myself.

What i need to do is simply add a new hidden field to store the original text before wmd process it.

And then i save both original and processed text into my database.

When i need to edit it, just use original text. When i need to render it, use the processed text.

Ecumenism

I sure would like to see the sample code there as to how you did that. the entry form , wmd? -- whatever that is and also the datatable, Do you have a brief sample of that and where I can get this wmd ? – Islean