CODEWITHSUNDEEP
javascripthtmlasp.netckeditor
Bip
Bip

Reputation: 697

CKEditor getEditor() Error, How to fix it?

<textarea cols="50" id="txt" contenteditable="true" name="editor1" runat="server" rows="10"></textarea>
<script type="text/javascript" src="css-js/ckeditor.js"></script>
<script type="text/javascript">
  CKEDITOR.replace('txt', {                    
  });       
</script>

I get this err on js :

TypeError: Cannot call method 'getEditor' of undefined

Upvotes: 14

Views: 49242

Answers (7)

John Mark
John Mark

Reputation: 73

for vanilla js

<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script>
   if(document.getElementsByTagName('textarea').length > 0){
      CKEDITOR.replace( 'article-ckeditor' ); 
   }
</script>

Upvotes: 0

Nishant Singh
Nishant Singh

Reputation: 1354

This is the correct way to do it (I found this method by inspecting django admin )

var textAreaEl = document.getElementById("id_html_txt")
var textAreadData = textAreaEl.dataset.config

var textEditor = CKEDITOR.replace(textAreaEl, textAreadData);
textEditor.insertHtml(textAreaEl)
  • Above configuration is for modal form but will work for normal form as well

Upvotes: 0

mjcoder
mjcoder

Reputation: 1011

I had a similar problem and sorted it by doing the following;

<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script>
    if($("textarea").length > 0){
        CKEDITOR.replace( 'ckeditor' );
    }
</script>

Upvotes: 1

Ismoilov Amir
Ismoilov Amir

Reputation: 33

The problem may be in included:

<script src="{{ asset('js/app.js') }}" defer></script>

Try to remove it. This can solve your problem

Upvotes: 0

Sanjay
Sanjay

Reputation: 1007

if you just want to get rid of that, use 

try{CKEDITOR.replace('body')}catch{}

it will cause CKEDITOR to open where you want it to

Upvotes: 3

oleq
oleq

Reputation: 15895

First of all, contenteditable="true" tag is totally invalid and obsolete in your case. Such attribute is relevant for inline instances only and, as <textarea> is not (content)editable, you don't need it.

Anyway, (even if buggy) your code works for me like a charm (fiddle). As a word of explanation, the error you see is produced when there's no element of an id passed to CKEDITOR.replace(), i.e:

<textarea id="foo"></textarea>
<script type="text/javascript">
     CKEDITOR.replace( 'bar' ); // <textarea> is #foo, error will be thrown
</script>

Make sure your DOM is valid and <textarea> exist when CKEDITOR.replace is called (working async?).

Upvotes: 17

jayadevkv
jayadevkv

Reputation: 372

Use

CKEDITOR.appendTo( 'txt' ); for DOM elements

CKEDITOR.replace( 'textarea' ); for textarea

Ok dude try this also

the functions appendTo and replace are all located in themedui.js file

try adding it separately,here is the link

http://docs.ckeditor.com/source/ckeditor.html#CKEDITOR

Upvotes: 3

Related Questions