CODEWITHSUNDEEP
jquerylaravelckeditorkeyup
anonymus
anonymus

Reputation: 171

Why keyup function is not working in CKEDITOR?

In my application, I have a textarea and I am handling it with ck editor. I am trying to call the keyup function on ck editor and print a text to console on the condition whether it has input or not. But it is not working as I expected and I am unable to find the error as it is not at least printing any errors to the console. Also, I want to get only the text from ck editor (except white spaces) to the variable editorInput. I am pasting my code here, please someone look into this and correct my error and modify it to get only the text. Thanks in advance.

CK Editor

<div class="form-group {{ $errors->has('template_content') ? 'has-error' : '' }}">
    {{ Form::label('template_content', 'Template Content') }}
    {{ Form::textarea('template_content', null, array('class' => 'form-control', 'id' => 'ckeditor', 
    'name' => 'ckeditor', 'required', 'data-error="Template content is required"')) }}
    {!! $errors->first('template_content', '<span class="help-block">:message</span>') !!}
    <div class="help-block with-errors"></div>
</div>

Keyup Function

$(document).ready(function () {
        CKEDITOR.instances.ckeditor.on('key', function() {
            var editorInput = CKEDITOR.instances["ckeditor"].getData();
            if(editorInput == '') {
                console.log('no-content');
            } 
            else {
                console.log('has-content');
            }
        });
    });

Upvotes: 1

Views: 345

Answers (1)

Andy Song
Andy Song

Reputation: 4684

here is an example with just js.

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8">
                <title>CKEditor</title>
                <script src="https://cdn.ckeditor.com/4.13.1/standard/ckeditor.js"></script>
        </head>
        <body>
                <textarea name="editor1"></textarea>
                <script>
                        CKEDITOR.replace( 'editor1' );
                </script>
        </body>
</html>

Upvotes: 1

Related Questions