使用 CKEDITOR 会隐藏默认的 TEXTAREA 并且不显示 CKEDITOR

Question

I want to implement CKEDITOR. I included the ckeditor in footer and replaced all.

<script src="<?= site_url('theme/black/assets/plugins/ckeditor/ckeditor.min.js') ?>" type="text/javascript"></script>
<script>
CKEDITOR.replaceAll();
</script>

And in my HTML, I have

<div class="clearfix"></div>
<div class="col-md-12">
    <div class="form-group">
        <label class="control-label col-md-2">Text<span class="required">*</span></label>
        <div class="col-md-8">
            <textarea name="text" id="text" class="form-control ckeditor" style="height:100px;"><?= $results[0]['text']; ?></textarea>
            <span class="help-block"></span>
        </div>
    </div>
</div>

But it hides my default TEXTAREA, and I don't see any CKEDITOR. When I inspect the element, the visibility for default textarea is set to hidden. What have I done wrong?

Answer 1

Keep ckeditor folder in your project directory and provide reference from that as beloow

<script src="~/ckeditor/ckeditor.js"></script>
<script src="~/ckeditor/styles.js"></script>

than you can create text areas as usual you have done.

Answer 2

If you are referencing your app.js like this:

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

Change it to this format:

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

In your app.blade.php file