Well, fixed this myself. Found out that the examples on that page weren't compatible with Bootstrap 3, so I tried to write my own example with the Bootstrap docs. (i am such an idiot for using examples)
bootstrap-modal.js broken in Bootstrap 3
-
30-06-2022 - |
문제
In my code, there are 2 sections (taken from the example) - Some Input and Some More Input. I only see Some More Input with a disabled scrollbar and some buttons on the left of the page. (look at it here)
Before you answer, I've already applied the patch BEFORE the main bootstrap-modal CSS and have both bootstrap-modal and modalmanager included. I've tried placing it everywhere, but it still shows up broken.
My code:
<div id="responsive" class="modal fade" data-width="760" style="display: none;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Responsive</h4>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<h4>Some Input</h4>
<p><input class="form-control" type="text"></p>
</div>
<div class="col-md-6">
<h4>Some More Input</h4>
<p><input class="form-control" type="text"></p>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" data-dismiss="modal" class="btn btn-default">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
해결책 2
다른 팁
Activate a modal without writing JavaScript. Set data-toggle="modal" on a controller element, like a button, along with a data-target="#foo" or href="#foo" to target a specific modal to toggle.
So you should add this code below.
<button type="button" data-toggle="modal" data-target="#responsive">Launch modal</button>
http://getbootstrap.com/javascript/#modals
Look At the madal document, it explain how to use the madal method.