Integrate of FCK Editory

Start point:

http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Integration/ASP.NET

First issue, do not forget to copy the FCKeditor to your project. Otherwise, after you add the control to your test page and start to debug, an error message will pop up.

Second issue, after making the demo page work and start to type a few words, I noticed that there is a spell checker button. After I click this button, a dialog pop up with a license information. I need to remove this button.


The following document provides way to customize tool bar.
http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Configuration/Toolbar

Following settings set a customized toolbar

FCKeditorV2:FCKeditor
ID="FCKeditor1" runat="server" ToolbarSet ="MyToolbar" Height = "600px"
FCKeditorV2:FCKeditor

In my code, I have an existing text area to allow user to type product description. With following code I can quickly replace the textarea to FCKEditor.

In Javascript of the page, add following code.

function ChangeToFCKEditio()
{
var oFCKeditor = new FCKeditor( 'ctl00_SampleContent_TextBox_ProductDescription' ) ;
oFCKeditor.BasePath = "/fckeditor/" ;
oFCKeditor.ReplaceTextarea() ;
}


In pageLoad event, add following code

protected void Page_Load(object sender, EventArgs e)
{

//set the start script
System.Text.StringBuilder onloadScript = new System.Text.StringBuilder();
onloadScript.Append("script type='text/javascript' defer");
onloadScript.Append("ChangeToFCKEditio();");
onloadScript.Append("/script");
this.ClientScript.RegisterStartupScript(this.GetType(), "OnLoadCall", onloadScript.ToString());

}

In Visual Basic .Net, code is as following

Partial Class _Default
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim onLoadScript As New System.Text.StringBuilder()
onLoadScript.Append("script type='text/javascript' defer")
onLoadScript.Append("ChangeToFCKEditor();")
onLoadScript.Append("/script")
ClientScript.RegisterStartupScript(GetType(Page), "OnLoadCall", onLoadScript.ToString())

End Sub
End Class



Note: in above code, <> and
have been removed. As soon as I kept this characters, the whole line will be removed by BloggerSpot. Not sure why.


The code to get user input in FCKEditor using Javascript:

oTmp.sDescription = escape(FCKeditorAPI.GetInstance('ctl00_SampleContent_TextBox_ProductDescription').GetXHTML());



Comments

Popular posts from this blog

Javascript Hosted on Google Drive Not Working Reliably

Newsmag Theme and External Featured Image

Responsive Web Design