jQuery validation and TinyMCE
Just solved a problem where the jQuery validation plugin wasn't playing so nicely with TinyMCE -- the validation plugin was trying to validate the textarea before TinyMCE had a chance to copy the editor contents back to the textarea. I was about to yank TinyMCE out of the page but a little reading through the TinyMCE docs led me to try this:
$('#mySubmitButton').click(function() {
var content = tinyMCE.activeEditor.getContent(); // get the content
$('#myTextarea').val(content); // put it in the textarea
});
$('#myForm').validate();23 comments
thanks for writing this clear page !
Thank you for posting this! I just spent about an hour trying to figure this out and *almost yanked TinyMCE, too :p
$('.submit').click(function() {
var content = tinyMCE.get('myContent').getContent(); // get the content
$('#myContentId').val(content); // put it in the textarea
});
You could also use this with the jQuery .each method to update an array of TinyMCE textareas.
tinyMCE.init({
// whatever ....
});
$(document).ready(function() {
$("input[type='submit']").click(function() {
tinyMCE.triggerSave();
});
// validate signup form on keyup and submit
$("#editEntryForm").validate({
// whatever ...
});
});
Of course, that's still not perfect, because it only works on clicks of the button. Really, the jquery.validate script needs to take a prevalidation script block to handle situations like this...
its working well.. thanks lot..
if any one doubt on it.. go through it.
$(document).ready(function(){
$('#submit_curriculum').click(function(){
var content = tinyMCE.activeEditor.getContent();
$('#curriculum_description').val(content);
$("#curriculum").validate();
});
Thanks
saran
The only thing I might add to that is checking the parent form's validate() options to see whether or not you should trigger the .valid() call on blur. Something like...
tinyMCE.init({
mode : "textareas",
theme : "simple",
// update validation status on change
onchange_callback: function(editor) {
tinyMCE.triggerSave();
var $editor = $("#" + editor.id);
if ($editor.closest('form').data('validator').settings.onfocusout !== false) {
$editor.valid();
}
}
});
