Textarea value change when summernote div is changed
Using the summernote API
I came up with this solution:
$(document).ready(function() { $('#summernote').summernote({ onKeyup: function(e) { $("#lawsContent").val($("#summernote").code()); }, height: 300, });});
I think it is better to handle the onChange event.
v0.7.0
$('#summernote').summernote({ callbacks: { onChange: function(contents, $editable) { console.log('onChange:', contents, $editable); } }});
v0.6.5
As of this version, callback only works with camel case string.
$('#summernote').summernote({ onChange: function(contents, $editable) { console.log('onChange:', contents, $editable); }});
Inspired by @user3367639, this is a more generic way to do it
$('.summernote').each(function () { var $textArea = $(this); $textArea.summernote({ onKeyup: function (e) { $textArea.val($(this).code()); $textArea.change(); //To update any action binded on the control } });});
And with this method :
String.prototype.strip = function(){ var tmpDiv = document.createElement("div"); tmpDiv.innerHTML = this; return tmpDiv.textContent || tmpDiv.innerText || "";}
You could do in your JS controller something like this to get the text value of your textarea
$myTextArea.val().strip(); //Where val() returns the html and strip() returns the text
Hope this will help