Skip to content

usage with CKEditor

Juan Manuel Alvarez Gimenez edited this page Jul 11, 2014 · 9 revisions

download your ckeditor package

<script type="text/javascript" src="ckeditor/ckeditor.js"></script>

configure

    var at_config = {
      at: "@",
      data: names,
      tpl: "<li data-value='@${name}'>${name} <small>${email}</small></li>"
    }

    CKEDITOR.replace('ck').on('instanceReady', function(event) {
      // Make sure the textarea's `contentEditable` property is set to `true`
      this.document.getBody().$.contentEditable = true;
      $(this.document.getBody().$).atwho(at_config)
    });

Prevent adding a new line when pressing ENTER

var ckeditor = $('#yourSelector').ckeditor({...}).ckeditorGet();
ckeditor.enableEnter = true; //Use this as a flag

ckeditor.on('instanceReady',function(event) {
    var at_config = {...};

   this.document.getBody().$.contentEditable = true;
    $(this.document.getBody().$).atwho(at_config);
    $(this.document.getBody().$).on('shown.atwho', function(event){
        ckeditor.enableEnter = false;
    });
    $(this.document.getBody().$).on('hidden.atwho', function(event){
        ckeditor.enableEnter = true;
    });
});

ckeditor.on( 'key', function( event ) {
    if ( event.data.keyCode == 13 && !ckeditor.enableEnter ) {
        event.cancel();
    }
});