Ckeditor character limitation with charcount plugin

How can I prevent users from entering new characters after reaching the maximum character ?

The cceditor charcount plugin just shows me the remaining characters, I want it to stop at 0. But it has minus integers.

Here is my html code.

<textarea id="myTextEditor1" name="myTextEditor"></textarea>
<script type="text/javascript">
        CKEDITOR.replace('myTextEditor1', { 
            height: 200, 
            extraPlugins: 'charcount', 
            maxLength: 10, 
            toolbar: 'TinyBare', 
            toolbar_TinyBare: [
                 ['Bold','Italic','Underline'],
                 ['Undo','Redo'],['Cut','Copy','Paste'],
                 ['NumberedList','BulletedList','Table'],['CharCount']
            ] 
        });
</script>

      

Do I need to use the onChange plugin ? If I have a question, how can I restrict users to enter new characters?

+3


source to share


1 answer


I used the ckeditor jQuery adapter for this.

<textarea id="myTextEditor1" name="myTextEditor"></textarea>
<script type="text/javascript">
    $(function () {
        var myEditor = $('#myTextEditor1');
        myEditor.ckeditor({ 
        height: 200, 
        extraPlugins: 'charcount', 
        maxLength: 10, 
        toolbar: 'TinyBare', 
        toolbar_TinyBare: [
             ['Bold','Italic','Underline'],
             ['Undo','Redo'],['Cut','Copy','Paste'],
             ['NumberedList','BulletedList','Table'],['CharCount']
        ] 
        }).ckeditor().editor.on('key', function(obj) {
            if (obj.data.keyCode === 8 || obj.data.keyCode === 46) {
                return true;
            }
            if (myEditor.ckeditor().editor.document.getBody().getText().length >= 10) {
                alert('No more characters possible');
                return false;
            }else { return true; }

        });
    });
</script>

      



Keycode validation is a return and delete keystroke permission. To use the jQuery adapter, don't forget to insert it:

<script src="/path-to/ckeditor/adapters/jquery.js"></script>

      

+8


source







All Articles