I have a textarea and a resume/CV sample template on document.

On button event that template's HTML is the value of textarea.

I am doing it as below-

$(function(){
    $('#select-sample').click(function(){
    var sample=$('.ok').html();
        $('.summernote').val(sample);
    });

});

This is just a simple copy thing is happening in textarea, I am picking up an HTML of template and copying it into textarea.

My question-

How do I render that HTML template in textarea as it is rendered in document. I don't want rendered HTML.

Why won't Textarea render this HTML template when all related css classes are attached within document itself?

Fiddle for this

I have a textarea and a resume/CV sample template on document.

On button event that template's HTML is the value of textarea.

I am doing it as below-

$(function(){
    $('#select-sample').click(function(){
    var sample=$('.ok').html();
        $('.summernote').val(sample);
    });

});

This is just a simple copy thing is happening in textarea, I am picking up an HTML of template and copying it into textarea.

My question-

How do I render that HTML template in textarea as it is rendered in document. I don't want rendered HTML.

Why won't Textarea render this HTML template when all related css classes are attached within document itself?

Fiddle for this

• javascript
• jquery
• html
• css
• templates

• try this: $('.summernote').text(sample) or html(sample) – user1956570 Commented Jan 7, 2014 at 17:48
• Possible duplicate of Rendering HTML inside textarea – sirdank Commented Nov 10, 2015 at 17:03
• Is there a way to potentially get the text (with html) inside of a textarea? Because whenever I do, and try putting the value in a <div>, the tags don't show anything. It shows the tags still??? – Taha Paracha Commented Aug 16, 2023 at 22:31

3 Answers 3

Textarea elements are intended only for text input or manipulation, they have nothing to do with rendering. If you want to render, make a div: <div class="summernote"></div>. And change your jQuery to: $('.summernote').html(sample);

This is because the textarea element only shows text, if you wish to use markup you will need to make use of javascript and the contenteditable property or include a wysiwyg editor script, many of those can be easily found, although one of the most well known editors would be tinyMCE.

You can use $('.summernote').code(sHTML);

http://hackerwins.github.io/summernote/features.html#api-code