Log in or register to post comments
Last post
mitch1990's picture
Joined: 28/12/2011
Posts: 3
CKEditor disappears textarea
Hello.

I'm trying to use CKEditor in my zend framework.
But when i load the page, the text area disappears...

I tried a plain page without the framework and that works good, but i want it to work.

output:
<!-- application/layouts/scripts/layout.phtml -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script>
            var BaseUrl = "";
        </script>
        <title>title</title><link href="/css/ui-lightness/jquery-ui-1.8.16.custom.css" media="screen" rel="stylesheet" type="text/css" />
<link href="/css/style.css" media="screen" rel="stylesheet" type="text/css" /><script type="text/javascript" src="/js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/js/global.js"></script>

<script type="text/javascript" src="/js/ckeditor.js"></script>
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>        <link rel="icon" type="favicon.icon" href="favicon.ico" />
    </head>
    <body>

        <div class="content">
            <div class="header">
                <div class="logo"></div>
                            </div>

            <div class="menu">
                <div class="fietslinks"></div>
                <div class="menudiv" id="menu">
                    <ul>
                        <li><a href="/index">Home</a></li>
                        <li><a href="/assortiment">Assortiment</a></li>
                        <li><a href="/assortiment/13">Occasion</a></li>

                        <li><a href="/service">Onze Service</a></li>
                        <li><a href="/bedrijffiets">Bedrijffiets</a></li>
                        <li><a href="/contact">Contact</a></li>
                    </ul>
                </div>
                <div class="fietsrechts"></div>
            </div>

            <div class="left">
        <!-- again for test -->        
        <script src="ckeditor/ckeditor.js" type="text/javascript"></script>
        <script src="js/ckeditor.js" type="text/javascript"></script>
        
        <h1 class="samples">
      CKEditor Sample &mdash; Replace Textarea Elements by Class Name
   </h1>
   <div class="description">

   <p>
      This sample shows how to automatically replace all <code>&lt;textarea&gt;</code> elements
      of a given class with a CKEditor instance.
   </p>
   <p>
      To replace a <code>&lt;textarea&gt;</code> element, simply assign it the <code>ckeditor</code>

      class, as in the code below:
   </p>
   <pre class="samples">&lt;textarea <strong>class="ckeditor</strong>" name="editor1"&gt;&lt;/textarea&gt;</pre>
   <p>
      Note that other <code>&lt;textarea&gt;</code> attributes (like <code>id</code> or <code>name</code>) need to be adjusted to your document.
   </p>

   </div>

   <!-- This <div> holds alert messages to be display in the sample page. -->
   <div id="alerts">
      <noscript>
         <p>
            <strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
            support, like yours, you should still see the contents (HTML data) and you should
            be able to edit it normally, without a rich editor interface.
         </p>
      </noscript>
   </div>
   <form action="sample_posteddata.php" method="post">
      <p>
         <label for="editor1">

            Editor 1:</label>
         <textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10">&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;</textarea>
      </p>
      <p>
         <input type="submit" value="Submit" />
      </p>
   </form>
   <div id="footer">

      <hr />
      <p>
         CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
      </p>
      <p id="copy">
         Copyright &copy; 2003-2011, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
         Knabben. All rights reserved.
      </p>

   </div>            </div>

            <div class="right">
                rightbar
            </div>

            <div style="clear: both;"></div>

            <div class="footer">copyright &copy; 2011</div>

        </div>

    </body>
</html>


what is going wrong?

edit: Woeps! wrong topic
mitch1990's picture
Joined: 28/12/2011
Posts: 3
Re: CKEditor disappears textarea
I found the problem,

my ckeditor.js


$jq(document).ready(function(){
    if (document.getElementById( 'editor1' )) {
       CKEDITOR.replace( 'editor1', {
            extraPlugins : 'autogrow',
            removePlugins : 'resize',
            toolbar :
            [
                    ['Source', '-', 'Save','NewPage','-','Undo','Redo'],
                    ['Find','Replace','-','SelectAll','RemoveFormat'],
                    ['Link', 'Unlink', 'Image', 'Smiley','SpecialChar'],
                    '/',
                    ['Bold', 'Italic','Underline'],
                    ['FontSize'],
                    ['TextColor'],
                    ['NumberedList','BulletedList','-','Blockquote'],
                    ['Maximize']
            ]
        });
    }
});


But what is wrong?
mitch1990's picture
Joined: 28/12/2011
Posts: 3
Re: CKEditor disappears textarea
help? :(
alfonsoml's picture
Joined: 31/12/2006
Posts: 3741
Re: CKEditor disappears textarea
I don't understand your second post. You say that you have found the problem, but I don't see anything strange there.

The only problem that I see with that code is that according to your original HTML the textarea should be automatically replaced as it has the class="ckeditor", so you should get an exception when you try to replace it twice.

And according to your original HTML, you're using XHTML, and if you send it with the proper XHTML mime type then you should get some errors in your error console.