How can I check whether CK Editor has input using JS/jQuery?

Question

In my application, there is a textarea and I've used CK Editor for it. Now I want to check whether user has input something to it (except whitespace). There were some methods for this. But nothing worked for me. It throws an undefined error when I use it.

Textarea

<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' => 'editor1', 
    'name' => 'editor1', 'required', 'data-error="Template content is required"', 'id' => 
   'templateContent')) }}
    {!! $errors->first('template_content', '<span class="help-block">:message</span>') !!}
    <div class="help-block with-errors"></div>
</div>

JS Function

var a = CKEDITOR.instances["editor1"].getData();

    if (a == '') {
        //code to execute
    } else {
        //code to execute
    }

Error

Uncaught TypeError: Cannot read property 'getData' of undefined

Answer 1

First

    {{ Form::textarea('template_content', null, array('class' => 'form-control', 'id' => 'editor1', 
    'name' => 'editor1', 'required', 'data-error="Template content is required"', 'id' => 
   'templateContent')) }}

here you have two id s, your textarea id is templateContent. remove 'id' => 'templateContent'

Second, this is not a watcher!, it's not going to update you realtime. you need to trigger it somehow, for example

<button id="test">get data</button>

$(document).ready(function() {
  $("#test").click(function() {
    var a = CKEDITOR.instances["editor1"].getData();

    console.log(a);
  });
});

Click the button and check the console.