Toggle CKEditor Plugin Button State

Question

What is the correct way to switch the state of the menu button of a ckeditor plugin based on selection?

For example, in the link / unlink plugin, I would only like to disconnect the link if the cursor is in the link.

editor.addCommand("unlink", { exec: function (editor) { //do something here }, refresh: function (editor, path) { // never seems to get fired. Is this even the right hook? } }); editor.ui.addButton("Unlink", { label: "Unlink", command: "unlink" }); 

Thanks for the help!

Answer 1

There is a property CKEDITOR.commandDefinition#contextSensitive , which allows you to control the state of the command in a specific context.

For example, the actual implementation of the Unlink button is as follows:

 CKEDITOR.unlinkCommand.prototype = { exec: function( editor ) { ... }, refresh: function( editor, path ) { var element = path.lastElement && path.lastElement.getAscendant( 'a', true ); if ( element && element.getName() == 'a' && element.getAttribute( 'href' ) && element.getChildCount() ) this.setState( CKEDITOR.TRISTATE_OFF ); else this.setState( CKEDITOR.TRISTATE_DISABLED ); }, contextSensitive: 1, ... };