when using this with bootbox.js ,the bootbox dialog style was confused

[jellybins]

like the title...how to fix this?..i found remove the ref of "bootstrap-modal-bs3patch.css" then bootbox changes to normal

[tiesont]

Is there a reason you're trying to use both? What version of Bootstrap are you trying to use? The current version of Bootbox is only meant for Bootstrap 3.

[jellybins]

yes , i want to use both bootbox and bootstrap-modal , and i‘am using bootstrap 3. so i included the "bootstrap-modal-bs3patch.css" in the page. but it made the bootbox window’s sytle abnormal.

[tiesont]

Bootbox doesn't have any styles of its own. We create the Bootstrap modal from string templates - everything else (display-wise) is pure Bootstrap. I would assume that patch file is for a much earlier version of Bootstrap, especially since this project was created for Bootstrap 2.

If you really want to mix these projects (which, I'll be honest, I don't entirely get), I would suggest creating a jsFiddle or similar that demonstrates what you're seeing. If you do that, I will try to take a look at what the problem might be, although I make no promises that I could come up with a fix.

[jschr]

hey all, it's been a long time since I've touched this lib and have not used bootstrap in a long time so maintenance / development has pretty much halted. I believe at some point bootbox and this plugin could play nicely but it's not something I ever accounted or tested for.

Thanks @tiesont for offering to take a look at this. I share the sentiment that if someone can provide a jsfiddle / reproducible I'll see what I can do to help find a workaround or if theres a simple fix I would gladly accept PRs.

[jellybins]

@tiesont i see the bootbox doesn't have any styles files. but it‘s script used original bootstrap modal . and this bootstrap-modal's style file "bootstrap-modal-bs3patch.css" change the original style . then make the bootbox’s window（also can call it “the original bootstrap modal”） becomes abnormal . and "bootstrap-modal-bs3patch.css" isn't use to compatible for previous versions of bootstrap , it's used for bootstrap 3.

[tiesont]

@jellybins I am aware of what the various files are used for; I used bootstrap-modal prior to switching to (and eventually becoming a maintainer for) Bootbox, and I still recommend it for devs that want more control over their modals than Bootbox can accommodate. The problem is that Bootstrap's modal markup has changed a little in each version of Bootstrap - even Bootstrap 4 requires updates to how modals are made, something I'm working on for the next version of Bootbox. There are also subtle differences in how the actual modal plugin works in each version of Bootstrap (in part due to how the markup changes).

It's also worth noting that bootstrap-modal, rather than encapsulating it's own function name, replaces the $.fn.modal function from Bootstrap.js - since Bootbox calls that internally, I would not be surprised if that is (in part) a reason for unusual behavior in Bootbox.

I'll reiterate my point from above;

I would suggest creating a jsFiddle or similar that demonstrates what you're seeing. If you do that, I will try to take a look at what the problem might be, although I make no promises that I could come up with a fix.

I have no problem trying to help you solve this problem (as @jschr says, he's not really active in Bootstrap these days, so...), but I'm not going to go through and try recreating what you're seeing entirely on my own. To quote Jerry Maguire: "Help me... help you"

[jellybins]

@tiesont @jschr i found the jsfiddle couldn't show modal window then creat the test.html in the upload file. just open that you can see the effect, then edit it remove the ref of ''bootstrap-modal-bs3patch.css" open thant again.

test.zip

[tiesont]

@jellybins I'm not entirely following what you're trying to say, there. I can tell you that Bootbox behaves as expected on it's own, in your test file, so it's definitely an issue originating from bootstrap-modal. I'll have to dig into the source to see what's going on, but I'm assuming it's just plain a matter of incompatibility.

Can you tell me exactly what it is you need that leads to trying to load both libraries at the same time?

[tiesont]

Here's my take, based on the README for bootstrap-modal;

The latest version (v4) of Bootbox is not compatible with bootstrap-modal, owing to this:

Since this plugin was created to solve a lot of the issues with BS2, it still uses the BS2 markup syntax.

It does seem to more or less work with the latest v3 version of Bootbox, which makes sense - Bootbox 3 was built for Bootstrap 2.2, which is where Bootstrap introduced a lot of breaking changes, including changes to the modal plugin and the markup and CSS it uses. If you decide to go that route, you'll want to review the v3 docs, as Bootbox also changed fairly significantly between 3.3 and the 4.0 release.