Post
Ask Question

CKEditor in ASP.NET

Introduction

This blog explains how to create an Text editor in ASP.Net.

Requirement

  1. Two dll : CkEditor.dll and CKEditor.NET.dll.
  2. CKEditor folder containing all js, css and images.

Code.aspx

When you are sure about the dlls and CKEditor folder in to your solution explorer then write the below line under page directive line :

<%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>

In your page place CKEditar control wherever you want like below:

<div>

   <CKEditor:CKEditorControl ID="CKEditor1" BasePath="/ckeditor/" runat="server">
   </CKEditor:CKEditorControl>
</div>

Finally I design a page for demo with below code lines:

<asp:Panel ID="Panel1" runat="server" Visible="false">

        <asp:Label ID="lblpre" runat="server" Text="" ></asp:Label>
        </asp:Panel>
        <br />
        <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" />

Here I have taken a CKeditor control then a label in a panel and then a button.

Code.cs

When you finish with design you can see the CKEditor on your page at the desired location but to view the content or text of CKEditor I have taken here a label .On button click below is the code to show text in label:

protected void Button1_Click(object sender, EventArgs e) 

{
    string str = CKEditor1.Text;
    string str1 = Server.HtmlEncode(str);
    lblpre.Text = str1;        

}

This is enough to work here, find the source code file here and check it at your side it ll work fine.