Return contents of rich text editor to servlet

Question

I want to return the contents of whatever is typed into the summernote rich text editor back to a servlet so I then can save it into a database but I cannot figure how to do it.

My jsp page script:

<script>
  $(document).ready(function() 
  {
      $('#summernote').summernote();
  });
</script>

<script type="text/javascript">
  var markupStr = $('#summernote').summernote('code'); //this gets the contents from the text editor.
  function myFunction()
  {
      return markupStr = $('#summernote').summernote('code');
  }
</script>

Button in jsp to submit to servlet:

new content: here

Servlet:

String test = request.getParameter("summerNoteText");

score 0 · Accepted Answer · edited May 23 '17 at 12:13

The actual questions should be:

How to set text value to and form element?
How to submit it to the server?

The answers:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>add text to text area and submit</title>
<!-- include libraries(jQuery, bootstrap) -->
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script> 
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script> 

<!-- include summernote css/js-->
<link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.css" rel="stylesheet">
<script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.js"></script>
<body>
    <div id="summernote">Hello Summernote</div>
    <script>
        $(document).ready(function() {
            $('#summernote').summernote();

            // copy the html-text from summernote to the hidden textarea
            // and let the browser submit it
            $('#myForm').submit(function() {
                $('textarea[name=summerNoteText]').val($('#summernote').summernote('code'));
            });
        }); 
    </script>
    <!-- use method post, because method get has limits of the max length -->
    <form action="Test" method="post" id="myForm">
        <!-- add a hidden textarea, wher the summernote code will be writen on submit -->
        <textarea name="summerNoteText" style="display:none;"></textarea>
        <input type="submit"/>
    </form>
</body>
</html>

Explained:

add a hidden textarea
copy the content of the editor to the textarea before submitting it.
but use form method post, because of it has higher max length limit You can read more on maximum length of HTTP GET request?

Return contents of rich text editor to servlet

1 Answers1