using CK editor in iframes

i realize that ck editor is working in a simple web page but it is not working in an iframe
why and how to solve such issue?
pamela rizkDeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Manoj PatilSr. Software EngineerCommented:
Can you tell me why you need CKEditor in iFrame ??
pamela rizkDeveloperAuthor Commented:
hi i need it because i need to add in iframe bold, italic charcteres etc..
Manoj PatilSr. Software EngineerCommented:
CKEditor provides you the Toolbar where you can do all your text design easily. And also you will be able to get whatever work you did in CKEditor as in the text format and you can save it in DB.

But if you are using CKEditor in iFrame then you will not be able to get the input text easily.
pamela rizkDeveloperAuthor Commented:
so what should be do?how to solve such case ?
Manoj PatilSr. Software EngineerCommented:
Don't use iFrame.
Just integrate CKEditor in your web page using below simple steps

  1. Open New Project [File->New->Project-> ASP.NET Empty Web Application]
  2. Name the Project as you like, I named it "TestCkEditor"
  3. Download the attached Zip file ( and extract.
  4. You will find a bin folder when you extract the
  5. Go to the Solution explorer [References->Right Mouse Click -> Add References->Browse-> Then browse the bin folder of the extracted ( -> Select The Two DLLs (CKEditor.dll & CKEditor.Net.dll)->OK]
  6. There is a folder called CKEditor in small caps. Find the folder. This folder contains all necessary files (.js , .css, images, themes, etc. that are necessary for successful integration of this tool.
  7. Copy this folder and paste it in your project.
  8. Then add a new aspx page to the project.
  9. Then write this single line of code just before the HTML tag of your .aspx page. This block of line will register the DLL file that you have just added & using the "TagPrefix" will call the CKEditorControl. Here the BasePath is the folder you have just added which contains all necessary files to load the CKEditor.
  10. <%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
  11. Then add this div inside of the form tag of your aspx page and we are done.
  12. <div>
       <CKEditor:CKEditorControl ID="CKEditor1" BasePath="/ckeditor/" runat="server">
  13. Build the project and then run. You will find CKEditor with full features at your screen. Then customize as per your requirements.

Here is the back end code under button click.

HtmlEncode and HtmlDecode are useful ways to use in here. HTML encoding makes sure that text is displayed correctly in the browser and not interpreted by the browser as HTML. For example, if there is a string in the CKEditor which contains a less than sign (<) or greater than sign (>), the browser would interpret these characters as the opening or closing bracket of an HTML tag. When the characters are HTML encoded, they are
converted to the strings &lt; and&gt;, which causes the browser to display the less than sign and greater than sign correctly.

protected void Button1_Click(object sender, EventArgs e)
            string str = CKEditor1.Text;
            string str1 = Server.HtmlEncode(str);
            string str2 = Server.HtmlDecode(str);
            lblText.Text = str2;

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.