i developing simple widget using following code. can please explain me why attribute , text iv set turn undefined after switching "source mode"?
<pre> /* /dialogs/b2eupobject.js */ ckeditor.dialog.add( 'b2eupobject', function( editor ) { return { title: 'edit simple box', minwidth: 200, minheight: 100, contents: [ { id: 'info', elements: [ { id: 'objectid', type: 'select', label: 'objectname', items: [ ['select', '-1' ], ['first name', '1' ], ['last name', '2' ], ], setup: function( widget ) { this.setvalue( widget.data.title ); //this.setvalue(widget.data.desc); }, commit: function( widget ) { widget.setdata( 'title', this.getvalue() ); var input = this.getinputelement().$; widget.setdata('desc',input.options[ input.selectedindex ].text); } }, ] } ], onshow: function() { // code executed when dialog window loaded. function defined above onok function var selection = editor.getselection(); //get element selected user (either highlighted or having caret inside) var element = selection.getstartelement(); // element in selection starts if ( element ) element = element.getascendant( 'em', true ); // abbr element console.log(this); }, onok: function() { // code executed when dialog window loaded. function defined above onok function var selection = editor.getselection(); //get element selected user (either highlighted or having caret inside) var element = selection.getstartelement(); // element in selection starts // if ( element ) console.log (element); console.log(this); } }; } ); </pre> <pre> /* plugin.js */ ckeditor.plugins.add( 'b2eupobject', { requires: 'widget', //reference generic widget plugin provides widget api icons: 'b2eupobject', init: function( editor ) { ckeditor.dialog.add( 'b2eupobject', this.path + 'dialogs/b2eupobject.js' ); editor.widgets.add( 'b2eupobject', { button: 'insert user object', template:'<em class="b2eup">test </em>', toolbar:'widgets', parts: {elm: 'em.b2eup'}, //this css selector of element within template above want target allowedcontent: 'em ( b2eup) [title]', requiredcontent : 'em(b2eup) [title]', dialog: 'b2eupobject', init: function (widget) { console.log("widget init : "+widget); // widget.parts.elm.setattribute('title',this.data.title); // widget.parts.elm.sethtml(this.data.desc); }, data: function (widget) { this.parts.elm.setattribute('title',this.data.title); this.parts.elm.sethtml(this.data.desc); }, upcast: function( element ) { alert(element.name == 'em' && element.hasclass( 'b2eup' )); return element.name == 'em' && element.hasclass( 'b2eup' ); }, } ); var plugindirectory = this.path; editor.addcontentscss( plugindirectory + 'style/style.css' ); if ( editor.contextmenu ) {// check if contextmenu plugin exsists editor.addmenugroup( 'b2eupgrougroup' ); // register new menu group called abbrgroup. editor.addmenuitem( 'b2eupitem', { //register new menu item belong newly created group. label: 'edit user object', icon: this.path + 'icons/b2eupobject.png', command: 'b2eupobject', group: 'b2eupgrougroup' }); editor.contextmenu.addlistener( function( element ) { // add event listener function called whenever context menu fired. if ( element.getascendant( 'em', true ) ) { // check if element of type abbr return { simpleboxitem: ckeditor.tristate_off }; } }); }; }, enter code here } ); </pre> i'm using ckeditor version 4.5 , have both widget , dialog plugins installed. ******* addition ******
when return source mode in editor can see upcast function invoked. writing log, can see returns true , element object :
ff console:
attributes: object { class="b2eup", title="1", data-cke-widget-data="%7b%7d", more...} children:[object { value="first name", _={...}, parent={...}, more...}]
Comments
Post a Comment