CKEditor - not displayed

I am trying to integrate ckeditor into my website written in java with play2.

Now I downloaded the javascript files and read the samples.

I realized that the important part is ckeditor.js

<script type="text/javascript" src="/assets/javascripts/ckeditor.js"></script>

I also used the same shape from the samples

<form action="sample_posteddata.php" method="post">
        <label for="editor1">
            CKEditor using the <code>docprops</code> plugin and working in the Full Page mode:</label>
        <textarea cols="80" id="editor1" name="editor1" rows="10">&lt;html&gt;&lt;head&gt;&lt;title&gt;CKEditor Sample&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;&lt;/body&gt;&lt;/html&gt;</textarea>
        <script type="text/javascript">
        //<![CDATA[

            CKEDITOR.replace( 'editor1',
                {
                    fullPage : true,
                    extraPlugins : 'docprops'
                });

        //]]>
        </script>
    <p>
        <input type="submit" value="Submit" />
    </p>
</form>

But this does not work, it just displays the normal text area. I am using twitter bootstrap + jquery 1.7.1.

Did I miss the important part?

enter image description here

+5
source share
8 answers

You just need to use this script

<script type="text/javascript">
    CKEDITOR.replace("editor1");
</script>
+4
source

ckeditor, . , CKEDITOR.replace( "editor1" ). backbone.js, . .

code

 jQuery(document).ready(function() {
  CKEDITOR.replace("editor1")
 });
+1

ckeditor.js , "CKEDITOR not defined". .....

 <script type="text/javascript" src="../assets/javascripts/ckeditor.js"></script>
0

, CKEDITOR.basePath, , , Uncaught TypeError: Cannot set property 'dir' of undefined, , basePath ....

0

, , id,

0

, , ckeditor.js. , .

<link rel="stylesheet" href="assets/css/ckeditor/contents.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/ckeditor/skins/boostrap/editor.css" rel="stylesheet">
<link rel="stylesheet" href="assets/css/ckeditor/skins/boostrap/editor_gecko.css" rel="stylesheet">
<script src="assets/js/ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/styles.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/config.js" type="text/javascript"></script>
<script src="assets/js/ckeditor/lang/en.js" type="text/javascript"></script>
0

I got a solution, and it works inside the controller of your view, and you have to publish your script code inside the controller code

0
source

This is pretty much what you need if ckeditor.js is not working:

<script>
            var CKEDITOR_BASEPATH = window.location.origin + '/.../CKEditor/';
</script>

It is described in the documentation here: http://docs.ckeditor.com/#!/guide/dev_basepath

This solved my problem when I put it in the header of my html.

0
source

All Articles