Opened 9 years ago
Closed 8 years ago
#14504 closed Bug (invalid)
Ckeditor event handler issue
Reported by: | cstsang | Owned by: | |
---|---|---|---|
Priority: | Normal | Milestone: | |
Component: | General | Version: | |
Keywords: | Cc: |
Description
I have a table, I want each cell can be editable when user click on a cell.
My code can done the job well, I want the updated data can be upload to server database when the editing complete, so I capture the blur event to do so, the problem is when I select text color in toolbar, the blur event is triggered also.
Here is my code:
<html> <head> <script type="text/javascript" language="javascript" src="http://code.jquery.com/jquery-1.12.0.min.js"></script> <script language="javascript" src="ckeditor/ckeditor.js"></script> <script language="javascript" src="ckeditor/adapters/jquery.js"></script> <script language="javascript"> $(document).ready(function() { $("[id^='editor']").ckeditor().on("blur",function(){alert($(this).ckeditor().editor.getData());return false;}); </script> </head> <body> <table border=1> <tr> <td> <div id="editor1" contenteditable="true"> <h1>Inline Editing in Action!</h1> <p>The "div" element that contains this text is now editable.</p> </div> </td> </tr> <tr> <td> <div id="editor2" contenteditable="true"> <h1>Inline Editing in Action!</h1> <p>The "div" element that contains this text is now editable. </div> </td> </tr> </table> </body> </html>
Here is my config.js
CKEDITOR.editorConfig = function( config ) { // Define changes to default configuration here. // For complete reference see: // http://docs.ckeditor.com/#!/api/CKEDITOR.config // The toolbar groups arrangement, optimized for a single toolbar row. config.toolbarGroups = [ { name: 'document', groups: [ 'mode', 'document', 'doctools' ] }, { name: 'clipboard', groups: [ 'clipboard', 'undo' ] }, { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] }, { name: 'forms' }, { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] }, { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] }, { name: 'links' }, { name: 'insert' }, { name: 'styles' }, { name: 'colors' }, { name: 'tools' }, { name: 'others' }, { name: 'about' } ]; // The default plugins included in the basic setup define some buttons that // are not needed in a basic editor. They are removed here. config.removeButtons = 'Anchor,Underline,Strike,Subscript,Superscript,Link,Unlink,Styles,About,HorizontalRule,Blockquote,Italic,SpellChecker,SpecialChar,Format'; // Dialog windows are also simplified. config.removeDialogTabs = 'link:advanced'; config.extraPlugins = 'onchange'; };
Here is my build-config.js
var CKBUILDER_CONFIG = { skin: 'office2013', preset: 'standard', ignore: [ '.bender', 'bender.js', 'bender-err.log', 'bender-out.log', 'dev', '.DS_Store', '.editorconfig', '.gitattributes', '.gitignore', 'gruntfile.js', '.idea', '.jscsrc', '.jshintignore', '.jshintrc', 'less', '.mailmap', 'node_modules', 'package.json', 'README.md', 'tests' ], plugins : { 'a11yhelp' : 1, 'about' : 1, 'basicstyles' : 1, 'blockquote' : 1, 'clipboard' : 1, 'colorbutton' : 1, 'contextmenu' : 1, 'elementspath' : 1, 'enterkey' : 1, 'entities' : 1, 'filebrowser' : 1, 'floatingspace' : 1, 'format' : 1, 'horizontalrule' : 1, 'htmlwriter' : 1, 'indentlist' : 1, 'list' : 1, 'magicline' : 1, 'onchange' : 1, 'panelbutton' : 1, 'pastefromword' : 1, 'pastetext' : 1, 'removeformat' : 1, 'resize' : 1, 'specialchar' : 1, 'stylescombo' : 1, 'tab' : 1, 'toolbar' : 1, 'undo' : 1, 'uploadwidget' : 1, 'wsc' : 1 }, languages : { 'en' : 1, 'zh' : 1, 'zh-cn' : 1 } };
Attachments (3)
Change History (4)
Changed 9 years ago by
Changed 9 years ago by
Attachment: | build-config.js added |
---|
Changed 9 years ago by
comment:1 Changed 8 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
Version: | 4.5.7 |
If you try below code then it will work:
If you look at
ckeditor()
method, you will notice that it returnjQuery
object and event that is assigned here doesn't belong toCKEditor
but tojQuery
.Unfortunately these events may be fired too often - http://docs.ckeditor.com/#!/guide/dev_jquery-section-event-handling