Hi,

I was playing with Bootstrap modal and couldn't get any buttons work on the modal form. Eventually made it work by switching the css files load order (load application.css before Bootstrap), it all worked now. Although I have no clue why and wonder is it ok to do so?

Thanks in advance.

Jun

No it probably isn't because there are a number of features in application.css that will build on top of the Bootstrap features. While it may fix this particular issue it's likely to break a number of others.

That is if you are using the standard Web Connection layout components. They are optional if you want to do something completely different although you still need them for error pages and a few other 'standard' dialogs.

It's probably better to dig and see what's causing the buttons to not work. What is actually happening? Is the overlay ontop of the form? If so you might just be able to change the z-order of the background overlay or the z-order of the actual modal.

+++ Rick ---

Thanks Rick!

I added the following css and it worked:

.modal-backdrop {
    z-index: 1020;
}

As long as the backdrop z-index is less than 1024. Otherwise the whole browser window is just grayed out.