Refresh FCKeditor without refreshing the whole page

I've come up with a solution that will refresh the entire editor (reloads the format drop down as well) without refreshing the whole page. I've been stumped on this for quite a while and needed to get it working so that I could use javascript to change an editor's CSS to match a template.

I added the following code to the fckeditor.html file..

CODE:
  1. // mod to allow for custom editor area css
  2. if(FCKURLParams['EditorAreaCSS'])
  3. FCKConfig.EditorAreaCSS = FCKURLParams['EditorAreaCSS'];

and that allows me to pass in a parameter to the iframe that will force the editor to use the new CSS.

To refresh the editor using javascript I have used the following:

CODE:
  1. var oEditor = FCKeditorAPI.GetInstance('content') ; //get editor object
  2. document.getElementById("content").value = oEditor.GetHTML(); //save any changes
  3. document.getElementById("content___Frame").src=document.getElementById("content___Frame").src.replace(/templates\/(.*)\/fck.css/,"templates/"+template+"/fck.css"); //refresh the iframe with new css

I also needed to change my fckeditor.class.php so that the src attribute of the iframe was something like this:

CODE:
  1. /puppy/fckeditor/editor/fckeditor.html?InstanceName=content&Toolbar=Puppy&EditorAreaCSS=/templates/mytemplate/fck.css

1 Response to “Refresh FCKeditor without refreshing the whole page”


  1. 1 SachinKRaj

    Can you please explain it little more ? where to put the code and how? you have only said about fckeditor.html, but where we need to put this code? One more thing, I am using FCKEditor with MediaWiki, YOu have fix for it?

Leave a Reply