1
votes

I have written an admin plugin for WordPress 3.1. The plugin has a TinyMCE textarea. I am using jQuery Form to submit the form data to the processing page. The TinyMCE textarea displays properly and I am able to type content into it. However, when I send the data to the processing page, all data except the content of the TinyMCE textarea is sent and the processing page returns the expected result. If I click send a second time, the TinyMCE date is sent. How can this be fixed?

Here is the javascript:

    <script type="text/javascript">    
jQuery(document).ready(function() { 
        var options = { 
            target: '#output',
            url: '../wp-content/plugins/kac/ajax/send_email_to_list.php'
        }; 

    jQuery('#form1').ajaxForm(options);
}); 

function showResponse(responseText, statusText, xhr, $form)  { 

    alert('status: ' + statusText + '\n\nresponseText: \n' + responseText + 
        '\n\nThe output div should have already been updated with the responseText.'); 
} 
</script>

Here is the html:

<form method="post" id="form1" name="form1">
<label for="subject">
Subject:
</label><br />
<input name="subject" id="subject" type="text" size="40" maxlength="100" /><br /><br />
<?php
wp_tiny_mce( false , // true makes the editor "teeny"
    array(
        "editor_selector" => "myeditor"
    )
);

?>
<label for="message">

Message: 
</label>
<textarea class="myeditor" id="message" name="message"></textarea><br /><br />
<input name="send" id="send" type="submit" value="Send" />
</form>    
1

1 Answers

12
votes

You need to be aware that tinymce is not equal the textarea! Tinymce will hide the textarea on intialization and create an iframe in which the user may edit content. Thus it is needed to call the tinymce save method in order to write the iframes content back to the textarea.

So you need the following code

var editor = tinymce.get( editor_id);
editor.save();  // writes content back to the textarea
// you may now use jQuery or editor.getContent(); to acces the content