Easy way to get FCKEditor to work inside an ASP.Net AJAX UpdatePanel

March 30th, 2007 | Tags: , ,

The Problem

I had a MultiLine TextBox inside an UpdatePanel and I wanted that TextBox to have rich editing capabilities so I chose FCKEditor. But, now when I do a partial PostBack, the TextBox doesnt retain it value.

An Initial Solution

So, I searched for a solution to this problem and found this post, but it seemed like more of a hack than I prefer.

A More Elegant Solution

As it turns out, there is a much simpler way hinted at in the FCKEditor wiki:

private void Page_Load(object sender, EventArgs args)
        "FCKeditorAPI.GetInstance('" + editor.ClientID + "').UpdateLinkedField();");

If you have multiple FCKEditors, you need to apply this solution to each one:

private void Page_Load(object sender, EventArgs args)
        "FCKeditorAPI.GetInstance('" + editor1.ClientID + "').UpdateLinkedField();");

        "FCKeditorAPI.GetInstance('" + editor2.ClientID + "').UpdateLinkedField();");

One Small Problem

There is one small issue with this solution, however—there will be JavaScript errors if you hide the TextBox during a partial PostBack.

For example, if you have a three step form: edit, review, and then publish. On the edit step the TextBox is shown and you enter and style your rich text, then you click the review button and this causes a partial PostBack which removed the TextBox and shows a preview of the text you enterred. When you click the publish button there will be a JavaScript error because the Textbox is no longer visible.

The Final Solution

To solve this problem and come to an elegant, working solution I just needed to add in some basic error checking. Since the JavaScript was getting a little more complex, I decided to move the main work into a .js file:

function FCKUpdateLinkedField(id)
        if(typeof(FCKeditorAPI) == "object")

And the page code now looks like:

private void Page_Load(object sender, EventArgs args)
        "FCKUpdateLinkedField('" + editor.ClientID + "');");
  1. Nameer
    July 27th, 2008 at 01:38
    Reply | Quote | #1

    Still get FCK is not defined if you postback for the second time (in firfox not ie)

  2. duncan
    February 5th, 2009 at 09:07
    Reply | Quote | #2

    thanks for posting this. elegant and effective. saved me time, no doubt!

  3. Naveen
    February 11th, 2009 at 06:18
    Reply | Quote | #3

    Hi Boss,
    Thnq very much, i was tried to fix this issue from morning onwards finaly i got your blog.

    Thanks very much
    NAveen M

  4. sara
    March 12th, 2009 at 00:44
    Reply | Quote | #4


    it works fine, but its refreshed the whole page within the updatepanel.
    Anyone give a solution for this, very grateful to them.

    thanks and regards

  5. March 26th, 2009 at 10:58
    Reply | Quote | #5

    superb! thanks a lot :D

  6. Javier
    May 25th, 2009 at 02:00
    Reply | Quote | #6

    The given code is not correct. As Naveen says the whole page will be refreshed.

    You have to use “ScriptManager” instead “Page.ClientScript”:

    ScriptManager.RegisterOnSubmitStatement(editor, editor.GetType(), “editor”, “FCKUpdateLinkedField(‘” + editor.ClientID + “‘);”);

    Notice that this method receives 4 parameters. The method of the example has 3 parameters.

    Even if you apply this change an error will appear. For example: if you change the visibility of the editor several times.

  7. September 10th, 2009 at 07:10
    Reply | Quote | #7

    Put this in Page_Load (NOT just if Page.IsPostback = false) and it will work no matter how many FCKeditors you have:

    ScriptManager.RegisterOnSubmitStatement(Me, Me.GetType(), “AjaxHack”, “for ( var i = 0; i < parent.frames.length; ++i ) if ( parent.frames[i].FCK ) parent.frames[i].FCK.UpdateLinkedField();")

  8. Matt
    December 1st, 2009 at 08:23
    Reply | Quote | #8

    This is noted for my experience with visualstudio 2008 asp.net 3.x, i don’t know if this problem exists for other versions of vs or asp.net.

    If you are using the fckeditor html/text editor tool in your webpages and have these lines of code it appears that whenever a postback occurs the fckeditor control will disappear from your UI. It also appears you can use the fckeditor without these lines of code and it will work fine(i.e. not disappear on postback).

    //string fullURL = Request.Url.AbsoluteUri;
    //int index = fullURL.IndexOf(“/ServiceEditor/”);
    //string path = fullURL.Substring(0, index);
    //fckFullDescr.BasePath = path + fckFullDescr.BasePath

    • Matt
      December 1st, 2009 at 08:23
      Reply | Quote | #9

      I should have noted fckFullDescr was the ID of my fckeditor control in the asp.net page.

  9. Mark
    February 8th, 2010 at 11:50

    Outstanding…thank you!!!

  10. Luke
    November 22nd, 2010 at 11:39

    AMAZING, thank you. It’s still helping people three years down the line.

  11. Sankar
    March 24th, 2011 at 22:30

    Working great :), Thanks lot

  12. Justice
    December 6th, 2011 at 00:47

    How do i get the FCKeditor not to flash on Ajax UpdatePanel Postback. I have put the FCKeditor inside the updatepanel but it flashes everytime a dropdown is clicked.

    Please assist.

  13. Alireza
    February 2nd, 2012 at 21:55

    it works fine…….

    thanks and regards