bootstrap-modal.js broken in Bootstrap 3

Question

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>

Answer 1

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)

Answer 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.