I've recently discovered a problem when submitting forms using TinyMCE Jquery-plugin. When trying to submitting normal input fields such as text fields, select boxes and so on, everything works as it should. However, using TinyMCE on a textarea doesn't work correctly; i have to submit two times to save. Is there a fix for this particular problem?
<script>
$(function () {
$('.message').removeClass('hidden');
});
$(function () {
$('form').on('submit', function (e) {
//save button so we can use later
var my_button = $(this).find("button");
//give button loading state
my_button.button('loading');
e.preventDefault();
var note = $("#content").text();
$.ajax({
type: 'POST',
dataType:'html',
url: '/m/core/_processEditEntry.php',
data: $('form').serialize(),
success: function () {
//reset state
my_button.button('reset');
$(".message").fadeIn(0);
$(".message").delay(5000).fadeOut('slow');
}
});
});
});
</script>
HTML
<textarea id="cotent" name="content" style="width:100%"><?php echo $entry->content; ?></textarea>
Answer to my question.
I needed to add tinyMCE.triggerSave();
<script>
$(function () {
$('form').on('submit', function (e) {
//save button so we can use later
var my_button = $(this).find("button");
//give button loading state
my_button.button('loading');
e.preventDefault();
tinyMCE.triggerSave();
var note = $("#content").text();
$.ajax({
type: 'POST',
dataType:'html',
url: '/m/core/_processEditEntry.php',
data: $('form').serialize(),
success: function () {
//reset state
my_button.button('reset');
$(".message").fadeIn(0);
$(".message").delay(5000).fadeOut('slow');
}
});
});
});
</script>