ckeditor | the "required" attribute within <textarea> tag is not working

Question

When using CKEDITOR with <textarea> tag, it's not working.

 <textarea id="editor1" name="description" class="form-control" cols="10" rows="10" required></textarea>

 <script>
      CKEDITOR.replace('editor1');
 </script>

Any sugesstions?

Answer 1

Please see: https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_editor.html#event-required

You need to assign an event handler to CKEditor which "replaces" native textarea element.

---

If you are looking for more fancy way of showing messages than standard alert dialogs, please try using notifications. Below is the most basic example (when you press submit button while having empty editor, notification will be displayed):

var editor = CKEDITOR.replace( 'editor1', {
    language: 'en',
    extraPlugins: 'notification'
});

editor.on( 'required', function( evt ) {
    editor.showNotification( 'This field is required.', 'warning' );
    evt.cancel();
} );

Please note that contrary to what is written in documentation the notification plugin seems to be included into every preset. You can check it by using search box of Available Plugins, list box in online builder.