rpm192
rpm192

Reputation: 2454

Unable to invoke ck-editor textarea (Uncaught TypeError: $(...).ckeditor is not a function)

I'm using Laravel 5.7 with a package called laravel-ckeditor and I cannot invoke the ck-editor textarea.

I'm including the package and script into my view like so (this loads them at the bottom of my file, just above the </body> tag):

@section('js')
  <script src="{{asset('js/render_select2.js')}}" charset="utf-8"></script>
  <script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
  <script src="{{asset('js/render_ckeditor.js')}}" charset="utf-8"></script>
@endsection

The file ckeditor.js is being loaded in correctly, I can open it when viewing the page source.

I've even added the application service provider to my app.php file and published the assets.

jQuery is included before this. jQuery works since I can use it in another script without any issues. The file render_ckeditor.js contains this line:

$('.ck-textarea').ckeditor();

This is the textarea:

<div class="row">
  <div class="col-sm-12">
    <div class="form-group">
      {{Form::label('description', 'Product description')}}
      {{Form::textarea('description', '', ['id' => 'ck-textarea', 'class' => 'form-control ck-textarea', 'style' => 'resize: vertical', 'placeholder' => 'Product description'])}}
    </div>
  </div>
</div>

I've tried to invoke it by using the ID instead of the class, changing my render_ckeditor.js file to this:

$('#ck-textarea').ckeditor();

Using the ID or class both resulted in this error message:

Uncaught TypeError: $(...).ckeditor is not a function at render_ckeditor.js:1

What am I missing here?

Upvotes: 2

Views: 9066

Answers (1)

rpm192
rpm192

Reputation: 2454

Turns out that I have to include the jQuery adapter (duhh..), totally overlooked the additional include.

Adding this solved it:

<script src="/vendor/unisharp/laravel-ckeditor/adapters/jquery.js"></script>

Upvotes: 2

Related Questions