Bootstrap wysiwyg: how to get formatted text on the server side?

Question

I am learning Bootstrap and want to have a wysiwyg editor. I found bootstrap-wysiwyg and want to use it.

http://mindmup.imtqy.com/bootstrap-wysiwyg/

However, I cannot figure out how to get formatted text on the server side when submitting the form.

Answer 1

I learned how to do it. Here is how.

A hidden input field or text field is required. This field may have the name attribute specified for the field name of the object. His name should be what the server side expects.

Use jQuery to attach a form event handler to a form that contains the wysiwyg editor. The handler takes the text from the wysiwyg editor and sets it as the value of the hidden field.

Hope this helps someone else.

Answer 2

<textarea class="textarea" name="mytext" placeholder="Enter text ..." style="width: 810px; height: 200px"></textarea> 

use val ()

 $('.textarea').wysihtml5(); $('.textarea').val(); 

http://jsfiddle.net/suhailvs/vNPAJ/3/

you can receive it as a message

 request.POST['mytext'] 

Answer 3

This is an old thread, but perhaps these tips will help others.

As courious1 mentioned, we need to create a hidden text area (e.g. id = hidden-editor) in our form. and pass the value in #editor to our # hidden editor using javascript below:

 //-- submit button clicked $('#submit-btn').click(function(){ $('#hidden-editor').html( $("#editor").html() ); }); 

Answer 4

I finally came up with this solution. Failed to make onclick work ... but real-time modification is convenient. Thanks for the ideas.

 $('#editor').bind("DOMSubtreeModified",function(){ $('#you_hidden_textarea').html( $("#editor").html() ); }); 

Answer 5

Below is how to get the contents of the bootstrap-wysiwyg editor

Set id to next div here. I used the editor as id and I also set the save button.

 <div id="editor"> Go ahead&hellip; </div> <a class="btn" data-edit="bold" id="saveBtn" title="Save"><i class="icon-save"></i></a> 

Then

 $('#editor').wysiwyg(); $('#saveBtn').on('click',function(){ console.log($('#editor').html()); }) 

Hope this helps someone else in the future