CKEditor plugin for jQuery

[Tobiasz Cudnik]

Create a jQuery plugin, which will allow jQuery users easily integrate rich text editing into their applications.

Planned

• All API mockups
  • .ckeditor( func, config )
    Create new editor instance and fire callback when ready.
  • .ckeditorGet()
    Get already existing editor instance.
  • .ckeditorConfig()
    Change global ckeditor config
  • .val()
    val() on textareas returns/sets data on the editor
• Some global CKEditor events
  • create
  • setData
  • getData
  • destroy
• Submit integration
  • normal submit
  • ajaxSubmit ?

Below mockup of planned API.

Editor creation

// chainably transform textareas into CKEditor instance
$('textarea').ckeditor()

// extensive example
$('#editors textarea')
  .eq(0).ckeditor({ lang: 'pl', width: 300 }).end()
  .eq(1).ckeditor({ width: 500, height: 400 }).end()
  // more then one at once
  .slice(2).ckeditor({ lang: 'ar' }).end()

Internal API access

// get data from editor
$('textarea').ckeditor(function(){
  alert(this.getData());
});

// set data into editor
$('textarea').ckeditor(function(){
  this.setData("New editor content");
});

// change ui color
$('textarea').ckeditor(function(){
  this.setUiColor('#FFFFFF');
});

// remove editor from the page
$('textarea').ckeditor(function(){
  this.destroy();
});

jQuery integration

// use val() to get data
$('textarea:first').ckeditor(function( textarea ){
  $(textarea).val();
});

// use val() to set data
$('textarea:first').ckeditor(function( textarea ){
  $(textarea).val("New editor content");
});

Possible, not confirmed:

1. Easy editor's content lookup using selectors