Search code examples
asp.netasp.net-mvcckeditor

How to show ckeditor value on Asp.Net interface

I saved my htmlcontent from ckeditor textarea and I can't show this htmlcontent on webform.aspx.

this is my interface code

                    <div runat="server" id="aboutDiv">

                </div>

this is codebehind

if (reader.Read())
        {
            aboutDiv.InnerHtml = reader["KurumsalHakkimizda"].ToString();
        }

this is userview

Solution

  • First of all you need a text editor on your page, on witch the editor will put on. For example lets say that we have this TextBox. On code behind you get and set the text from asp:textbox very easy using the .Text parameter.

    <asp:textbox id="txtDescription" TextMode="MultiLine" runat="server"/>

    And second you need to initialize the ckeditor like

    jQuery(document).ready(function() 
{
    if (typeof(CKEDITOR) != 'undefined')
    {
        var editor = CKEDITOR.replace( "<%=txtDescription.ClientID %>" ,
        {
              entities:false
            , enterMode: 2
            , shiftEnterMode: 1
            ,toolbar :
            [
                ['Maximize', 'Source'],
                ['Cut','Copy','PasteText'],
                    [ 'Bold', 'Italic', 'Underline', 'Superscript', 'TextColor', 'BGColor', 'FontSize'],                        
                    [ 'Link', 'Unlink', 'HorizontalRule', 'Table'],
                ['NumberedList', 'BulletedList']                    
            ]        
            });
    else
    {
        // alert("you need to load the ckeditor");
    }
});

    One more full page example for asp.net

    <html lang="en">
    <head runat="server">
        <meta charset="utf-8">
        <title>A Simple Page with CKEditor 4</title>
        <!-- Make sure the path to CKEditor is correct. -->
        <script src="../ckeditor.js"></script>
    </head>
    <body>
        <form id="form" runat="server">
            <asp:textbox id="editor1" TextMode="MultiLine" runat="server">This is my textarea to be replaced with CKEditor 4.</asp:textbox>
            <script>
                // Replace the <asp:textbox .../> with a CKEditor 4
                // instance, using default configuration.
                CKEDITOR.replace( '<%= editor1.ClientID %>' );
            </script>
        </form>
    </body>
</html>

    base on CKEditor 4 Quick Start Guide