Can't post twice from the same AJAX TinyMCE textarea

Question

I've a list of elements editable via a simple AJAX/jQuery edit button, which works great. But when I try editing the same field a second time it doesn't want to play ball.

1. EDIT - AJAX returns a tinyMCE textarea containing content from MySQL
2. SAVE - AJAX posts tinyMCE contents to MySQL and displays posted content
3. EDIT (again) - Returns the same tinyMCE textarea and content as usual
4. SAVE (again) - The second time save is attempted, returns error: g.win.document is null

Code snippets

var content = tinyMCE.get('content').getContent(); //get tinyMCE content
$("#edititem").load("editItem.php", {content: content}); //jQuery post

---

Solution - this is how I got it working:

EDIT - when editing, add the tinyMCE control to the textarea

tinyMCE.execCommand("mceAddControl",true,'content');

SAVE - when saving, remove the control for next time

tinyMCE.execCommand('mceRemoveControl',false,'content');

Answer 1

I am more familiar with FCKeditor but I think it is similar. TinyMCE has mceAddControl command to add/create editor instances. Are you doing that after you reload your content?

tinyMCE.execCommand('mceAddControl' ...

Answer 2

Just thought I'd add a workaround solution that works in combination with the solution above:

setTimeout(function() {tinyMCE.execCommand("mceAddControl", true, "content");}, 5);

For whatever reason, I'm not sure if it's a timing issue with the DOM manipulation or something else, but a tiny delay makes life better. However the setTimeout() did NOT work in combination with using a jQuery .each() method, such as:

$("textarea").each(function(index) {
    tinyMCE.execCommand("mceAddControl", false, $(this).attr("id"));
});

That must be a whole different timing issue.

Anyhoo, thought I'd share these findings as I'm sure others and even possibly me again will find this posting helpful.

Answer 3

$(tinyMCE.editors).each(function(){ tinyMCE.remove(this); });