mindmup / bootstrap-wysiwyg

Tiny bootstrap-compatible WISWYG rich text editor
MIT License
5.56k stars 841 forks source link

Multiple instance, single toolbar #170

Closed CoachGodzup closed 9 years ago

CoachGodzup commented 9 years ago

Good morning everyone,

I'm using this plugin in a page that contains multiple instances of the editor (dynamically created, one fixed), but I need to have a single toolbar dynamically binded into the correct editor (I'm using Knockout 3.2).

I've already read issue #52 (https://github.com/mindmup/bootstrap-wysiwyg/issues/52) (expecially Makusu answer) and I've binded the code as below:

$('.editor').wysiwyg({ toolbarSelector: '[data-role=editor-toolbar]'} );

and for the toolbar

< div data-role="editor-toolbar" data-bind="attr: {'data-target' : $root.toolbarBind}" >

where $root.toolbarBind is the ID of the editor selected.

However, when I click some button on the toolbar, it modifies only the first of the editors, the fixed one. If I use the keyboard shortcut, they work flawlessy.

What could possibly went wrong?

CoachGodzup commented 9 years ago

UPDATE:

I've tried undo-redo buttons, they works. Seems like it has some issue with selections

CoachGodzup commented 9 years ago

SOLVED:

I've solved this problem commenting line 111 of bootstrap-wysiwyg.js, i.e. focusing of the editor. It works. I copy the modified function:

bindToolbar = function (toolbar, options) { toolbar.find(toolbarBtnSelector).click(function () { restoreSelection(); //editor.focus(); execCommand($(this).data(options.commandRole)); saveSelection(); });