Hello, i want to have a button that can switch mode of CKEditor: readonly/editing. I saw the answer of garry.yao to the same post:
but i have a problem: not all toolbars have been locked, script of creation CKEditor the next:
but 'Styles', 'Format', 'Font', 'FontSize', 'TextColor', 'BGColor' don't locked. 'Styles', 'Format', 'Font', 'FontSize' are <select>, and 'TextColor', 'BGColor' are simple buttons.
Can somebody help with this problem, please?
Hi all, I can understand the rational of having this functionality, yet we haven't plain to add it as a core feature, but please feel free to open ticket at our dev site to have it tracked.
Here I hope I could provide a temporary workaround for it:
// Temporary workaround for providing editor 'read-only' toggling functionality.( function() { var cancelEvent = function( evt ) { evt.cancel(); }; CKEDITOR.editor.prototype.readOnly = function( isReadOnly ) { // Turn off contentEditable. this.document.$.body.disabled = isReadOnly; CKEDITOR.env.ie ? this.document.$.body.contentEditable = !isReadOnly : this.document.$.designMode = isReadOnly ? "off" : "on"; // Prevent key handling. this[ isReadOnly ? 'on' : 'removeListener' ]( 'key', cancelEvent, null, null, 0 ); this[ isReadOnly ? 'on' : 'removeListener' ]( 'selectionChange', cancelEvent, null, null, 0 ); // Disable all commands in wysiwyg mode. var command, commands = this._.commands, mode = this.mode; for ( var name in commands ) { command = commands[ name ]; isReadOnly ? command.disable() : command[ command.modes[ mode ] ? 'enable' : 'disable' ](); this[ isReadOnly ? 'on' : 'removeListener' ]( 'state', cancelEvent, null, null, 0 ); } } } )();
Code: Select all// Turn CKEditor into 'ready-only' mode or vice versa. CKEDITOR.instances.editor1.readOnly( true ); CKEDITOR.instances.editor1.readOnly( false );
but i have a problem: not all toolbars have been locked, script of creation CKEditor the next:
CKEDITOR.replace('content', { toolbar : [ ['Source'], ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], ['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'], '/', ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'], ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'], ['Link','Unlink','Anchor'], ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'], '/', ['Styles','Format','Font','FontSize'], ['TextColor','BGColor'], ['Maximize', 'ShowBlocks'] ], language : '${lang}', entities: false, filebrowserUploadUrl : '<%=request.getContextPath()%>/pages/article-ajax?command=upload', width: '100%', height: 350, skin : 'v2' });
but 'Styles', 'Format', 'Font', 'FontSize', 'TextColor', 'BGColor' don't locked. 'Styles', 'Format', 'Font', 'FontSize' are <select>, and 'TextColor', 'BGColor' are simple buttons.
Can somebody help with this problem, please?