Fighting with TinyMCE and MonoRail AjaxHelper

There are several javascripts that performs changes in document elements when the page loads. To use the scripts you call a init function in the html header and they works fine but they don't work when you request just a piece of html from the server using Ajax, because the header has already been loaded. You need to call the function once the Ajax has returned.

I'm using this function to show the tinyMCE editor on an ajax requested form:

function tinyRepaint() {
 var textarea_num = document.getElementsByTagName("textarea").length
 var textarea;
 for (var i = 0; i <= textarea_num; i++) {   textarea = document.getElementsByTagName("textarea")[i];   if (textarea != null) {    tinyMCE.execCommand("mceAddControl", false, textarea.id);   }  } }

So, you need to invoke the remote method using this syntax:

$AjaxHelper.LinkToRemote("link", "action.rails", $DictHelper.CreateDict("update=$placeholder", "with='parameter=value",
loading=javascript:waitPointer('content')", "complete=javascript:defaultPointer('content'); tinyRepaint();"))

I use waitPointer and defaultPointer to do the request more intuitive for the user that is wainting for the server. But you only need this:

$AjaxHelper.LinkToRemote("link", "action.rails", $DictHelper.CreateDict("update=$placeholder", "complete=javascript:tinyRepaint();"))

Another problem is to get the textarea value before you send the filled form. I use this function:

function updateValues() {
  // manually save the tinyMCE content for each textarea
  var tas = document.getElementsByTagName('textarea');
  for(var i = 0; i < tas.length; i++) {   // snag the textarea    var ta = tas[i];    // put focus in the editor    tinyMCE.execInstanceCommand(ta.id, 'mceFocus');    // manually save the content    ta.value = tinyMCE.getContent();   } }

And invoke it onclick:
input type="submit" onclick="javascript:updateValues(); onsubmit()" ...

I have copied the javascript functions from this site

Enjoyed reading this post?
Subscribe to the RSS feed and have all new posts delivered straight to you.