search

froala / angular-froala

Angular.js bindings for Froala WYSIWYG HTML Rich Text Editor.
https://froala.com/wysiwyg-editor
MIT License
306 stars 123 forks source link

toolbarInlijne not showing up #121

Closed RonB closed 8 years ago

RonB commented 8 years ago

Hi,

I am using these options in the controller: $scope.froalaOptions = { toolbarInline: true, toolbarVisibleWithoutSelection: true, language: 'NL', toolbarButtons : ["bold", "italic", "underline", "|", "align", "formatOL", "formatUL"] }

HTML <div froala="froalaOptions" ng-model="record.data.inhoud"></div> I see the quick insert button, I can type text, but the toolbar is not visible when I make a selection. Any idea whats going on?

stefanneculai commented 8 years ago

@RonB I believe you might have a zIndex higher than the one of the editor. Could you please send us a link to the page where you have this problem via our contact form?

RonB commented 8 years ago

@stefanneculai Yes that is correct. I use the directive in dialogs, which can stack over each other. Now I need to set the z-index of the dialog to 3 or less, otherwise the toolbar is invissible. As the z-index of the (ng-)dialogs can increase, a value of 3 or less is not an option. Can you not specify a dynamic index wich makes sure the toolbar is directly above the z-index of the directives element?

stefanneculai commented 8 years ago

Unfortunately, that is not possible.

RonB commented 8 years ago

wow... any thoughts on this normal use-case?

stefanneculai commented 8 years ago

You could set the zIndex option of the editor to a high value. Doesn't that work?

RonB commented 8 years ago

The trouble is I dont know what value because the general code is the same for each dialog so I would need to keep track of the number of dialogs. I'll give it a try though. Thanks for the quick response.

stefanneculai commented 8 years ago

You could just set a higher value, like 9999, maybe.

RonB commented 8 years ago

Tried it and it works fine. The scenario where 2 editors interfere is not very likely. Thanks again.

RonB commented 8 years ago

If I may ask another related question, can you explain why the toolbar with zIndex 9999 now is visible, but the specific toolbar for table editing is not?

stefanneculai commented 8 years ago

It might be an issue from our side. Could you please send us a link to a page where you have this problem? It appears this is a problem very specific to your app, therefore please contact us via our website: https://www.froala.com/wysiwyg-editor/contact.

RonB commented 8 years ago

Hi Stefan,

It seems like the problem has to do with ngDialog. The zIndex param works but only for the primary toolbar. [https://plnkr.co/edit/U5NCfM?p=preview]

In the plunkr you can see the problem when clicking in a cell. the table toolbar is lying behind the dialog.

stefanneculai commented 8 years ago

I can see that you're using an older version of both the Angular plugin and the editor. Does this happen with the latest V2.3.4 version as well?

RonB commented 8 years ago

I have updated the plunkr to 2.3.4 and also pasted the last src from this master branche. I cannot see any difference.

stefanneculai commented 8 years ago

That appears to be a problem from our side. We'll review it shortly.

stefanneculai commented 8 years ago

@RonB last commit should fix this problem. Could you please check?