I'm trying to using summernote with JSF but i don't know why this always return empty string:
<div class="form-group">
<label>Conteúdo *</label>
<h:inputTextarea value="#{cursoMB.paginaConteudo.conteudo}"
id="conteudo" required="true"
requiredMessage="O conteúdo é obrigatório"
styleClass="form-control summernote">
</h:inputTextarea>
</div>
In my JS file:
$(document).ready(function() {
initSummerNote();
jsf.ajax.addOnEvent(initSummerNoteAjax);
});
function initSummerNoteAjax(data) {
if (data.status === 'success') {
jQuery('.summernote').summernote({
height : 300, // set editor height
minHeight : null, // set minimum height of editor
maxHeight : null, // set maximum height of editor
focus : false
// set focus to editable area after initializing summernote
});
}
}
When the modal is called the summernote is showed but when i save the content of textarea is empty.
That is because the summernote plugin not store the edited text in the textarea to get the edited text you have to call jQuery('.summernote').code()
I suggest you that in the button that you call to store the value add a javascript handler to get the text and add to textarea with that jsf store the string in the paginaConteudo.conteudo property
function beforeSubmit() {
jQuery('.summernote').text(jQuery('.summernote').code());
}
Also I suggest you to destroy the widget before recreating the ajax call
jQuery('.summernote').destroy().summernote({..........
Note for people using summernote after v0.7.0: You must use .summernote('code')
and .summernote('destroy')
now.
After v0.7.0, direct jquery methods, destroy and code were removed for avoiding conflict with other jquery libraries. You can call this methods with summernote api.
See also http://summernote.org/getting-started/#get-amp-set-code