Juan Pablo Garcia Blog

En el ultimo proyecto que estoy desarrollando, me encontré con la necesidad de utilizar un edior WYSIWYG  (What you see is what you get) y he optado por FCKEditor. Un completisimo editor, que incluye muchas funcionalidades, entre algunas:

• Inserción de imagenes, con un Server Browser que permite subir imagenes a nuestra aplicación.
• Insercion de archivos en flash.
• Previsualización
• Posibilidad de maximizar el contenido que estamos editando.
• Asignacion de archivo de estilos, y previsualización de los mismos en tiempo real.
• Integración, para ASP.NET, ColdFusion, ASP, Java, PHP y otros…
• Y muchas cosas mas…

Pero bueno, vamos al problema que me he encontrado:

Al insertar este control en un UpdatePanel de ASP.Net Ajax en intentar submitir los cambios en FireFox, se pierden el texto ingreado en el control.

Para que esto no suceda, como indican en la FCKEditor Wiki debemos registrar un Script en nuestra pagina, y añadir un atributo onclick, en nuestro control que se encarga de enviar los datos.

Para ello, crearemos un Script y lo guardaremos por ejemplo en /FCKEditor/editor/js/FCKHack.js con las siguientes lineas de código:

// Some Class
function MyFCKClass()
{
        this.UpdateEditorFormValue = function()
        {
                for ( i = 0; i < parent.frames.length; ++i )
                        if ( parent.frames[i].FCK )
                                parent.frames[i].FCK.UpdateLinkedField();
        }
}
// instantiate the class
var MyFCKObject = new MyFCKClass();

Luego en nuestra pagina, añadiremenos las siguientes lineas en el Page_Load:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        if (!Page.ClientScript.IsClientScriptBlockRegistered("FCKAjaxHack"))
        {
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
                "FCKAjaxHack",
                String.Format(@"<script type=""text/javascript"" src='{0}'></script>",
                ResolveUrl("~/FCKEditor/editor/js/FCKHack.js")));
        }
    }
    string sFCKHack = @" if (eval('(typeof(MyFCKObject) != \'undefined\')'))
                    {
                        MyFCKObject.UpdateEditorFormValue(); return true;
                    }
                    else
                    {
                        return true;
                    }";
    cmd.Attributes.Add("onclick", sFCKHack);
}

Donde cmd  en este caso es el botón que se encarga de submitir la página.

Fuentes:
http://forums.asp.net/1513800/ShowThread.aspx#1513800
http://wiki.fckeditor.net/Troubleshooting#head-c83215c3393542ddc261fb2b7a64b60a41253d76