Ext JS 4.1.1整合CKEditor。

阅读更多

Ext.define('GB.view.CKeditor', {
	extend : 'Ext.Component',
	alias : 'widget.ckeditor',
	cls : "xcke",
	initComponent : function() {
		this.html = "";

		this.callParent(arguments);
		this.on('afterrender', function() {
			this.editor = CKEDITOR.replace(this.getId() + '-input');
		}, this);
	},
	setValue : function(value) {
		this.callParent(arguments);
		if (this.editor) {
			this.editor.setData(value);
		}
	},
	getValue : function() {
		return this.getRawValue();
	},
	getRawValue : function() {
		if (this.editor) {
			return this.editor.getData()
		} else {
			return ''
		}
	}
});

除此之外，你还需要加入两个样式：

.xcke * {
	box-sizing: content-box !important;
	-moz-box-sizing: content-box !important;
	-ms-box-sizing: content-box !important;
	-webkit-box-sizing: content-box !important;
}

.cke_dialog_tabs * {
	box-sizing: content-box !important;
	-moz-box-sizing: content-box !important;
	-ms-box-sizing: content-box !important;
	-webkit-box-sizing: content-box !important;
}

运行后基本能用。