How to control stack order of modals that are dynamically loaded

[djsmith42]

This is more of a question than an issue.

I am using AngularJS's ng-include directive to download a few modals from the server. I am then showing/hiding them with $.modal('show') and $.modal('hide'). It seems that the stack order is random. I cannot seem to influence it with z-index, tabindex, or anything else.

What controls the stacking order of modals as they are hidden and shown?

[djsmith42]

P.S. My modal HTML fragments are downloaded in a seemingly random order. Is there a way to tell bootsrap-modal that I want their stack order to be a certain way, regardless of the order in which they are loaded into the DOM?

[djsmith42]

I think I have resolved my issue. I was calling $.modal('hide') on all my modals, and the order was non-deterministic. In reading the bootstrap-modal code, I realize that it pushes all modals onto its stack as they are initialized, even if they are just hidden. In my situation, the order was random. I have changed my code to not call $.modal() until the user actually clicks. That way, the stack order is correct for my application.