Call dialog from a bootstrap modal dialog - Position

Question

Call dialog from a bootstrap modal dialog - Position

felipeaffonso opened this issue 9 years ago · comments

Felipe Zanardo Affonso commented 9 years ago

Hi,

I'm trying to use your service with angular-bootstrap-ui modal (I really use it), but the position on the screen is wrong.

I suppose that a dialog with a validation error should appear on TOP of the screen, maybe something is wrong with the Z-Index, OR (more probably) I'm doing something wrong.

Thanks!

Michael E Conroy · Answer 1 · Mon Feb 22 2016 22:52:49 GMT+0800 (China Standard Time)

Do you have an example we could see?

There really is no CSS involved with this library (although there is a small CSS file that attempts to correct an old flaw in previous versions of Angular-Bootstrap-UI), if CSS is at fault its either with Bootstrap, Angular-Bootstrap-UI or a custom CSS class within your application. All I can do is speculate without seeing something.

alex3stones · Answer 2 · Wed Jun 01 2016 15:08:52 GMT+0800 (China Standard Time)

means, the dialog is on the back of modal window,instead of the top, tested this bug under angularjs 1.4.8 and angularjs-bootstrop-ui 1.3.2

alex3stones · Answer 3 · Wed Jun 01 2016 15:09:38 GMT+0800 (China Standard Time)

alex3stones commented 8 years ago

Michael E Conroy · Answer 4 · Thu Jun 02 2016 04:06:31 GMT+0800 (China Standard Time)

Not sure I understand.

The image shows that two dialogs have been opened. If you don't want that, you need to close the other before opening a new one. If you want the error dialog to show up over the dialog with the form I'm not sure we can help with that if the form dialog generated the error. This library doesn't fiddle with the z-indexing of Bootstrap, it only calls predefined layouts using the Angular-UI Modal service.

Doug Moscrop · Answer 5 · Thu Jun 02 2016 04:08:28 GMT+0800 (China Standard Time)

It's totally up to the consumer of this library to do 'window management' which includes trying to overlay a dialog on a modal. The CSS is in your control, set your layers/z-indices appropriately.

alex3stones · Answer 6 · Fri Jun 03 2016 17:13:12 GMT+0800 (China Standard Time)

@dougmoscrop: you are right. @m-e-conroy: any idea for this request? Thanks

Michael E Conroy · Answer 7 · Fri Jun 03 2016 20:54:20 GMT+0800 (China Standard Time)

I've had some minor CSS issues in the past with Bootstrap and Angular-UI and just used a small CSS file to fix. If your intention is to have the error dialog pop-up over the form dialog then I would suggest adding a css class to it upon opening - to insure its above the other. When passing in options to one of the dialog services you can set the "windowClass" property. This will add a css class to the dialog's main element. View the "IDialogOptions" of the readme for this library.