top button
Flag Notify
    Connect to us
      Site Registration

Site Registration

How to use CKEditor in ASP.NET?

+1 vote
598 views
How to use CKEditor in ASP.NET?
posted Feb 8, 2016 by Latha

Share this question
Facebook Share Button Twitter Share Button LinkedIn Share Button

1 Answer

+1 vote
 
Best answer

First download CKEditor For ASP.NET integration from official site, extract it and follow below steps.
1. Open Visual Studio 2012
2. File > New > Website
3. Visual basic or Visual C# > ASP.NET Empty Web Site
4. Web Site > Add Reference >
5. Browse to the bin folder where you extracted the CKEditor
6. Add CKEditor.NET.dll to your website
7. Now copy ckeditor (all small) folder from your extracted folder and paste it into your website folder
8. Website > Add New Item > Web Form
9. Add following line of code after page tag in your aspx file

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

10.Write below code in between form tag of aspx page

<CKEditor:CKEditorControl ID="CKEditor1" BasePath="/ckeditor/" Width="1000px" Height="300px" runat="server">
CKEditor:CKEditorControl>
<asp:Label ID="lblText1" runat="server">asp:Label>
<br />
<asp:Label ID="lblText2" runat="server">asp:Label>
<br />
 <asp:Button ID="btnShowText" runat="server" Text="Show Text" OnClick="btnShowText_Click" />

11.Now write code below in button click event in vb or cs file

C#

protected void btnShowText_Click(object sender, EventArgs e)
{
string text = CKEditor1.Text;
lblText1.Text = Server.HtmlEncode(text);
lblText2.Text = Server.HtmlDecode(text);
}

VB.NET

Protected Sub btnShowText_Click(sender As Object, e As EventArgs)
  Dim text As String = CKEditor1.Text
  lblText1.Text = Server.HtmlEncode(text)
  lblText2.Text = Server.HtmlDecode(text)
End Sub

HTMLDecode displays the text as you have written in the editor. It considers your formatting and displays text. On the other hand HTMLEncode displays html of the text.
12.Press F5. Write any text in CKEditor and format text according to your requirement and see the result

answer Feb 8, 2016 by Shivaranjini
...