How to get twitter bootstrap modal working in node js express js?

Question

This is my index.jade file

.navbar.navbar-fixed-top
    .navbar-inner
        .container
            .brand #{title}

    .container
        .row
            .hero-unit
                h1 #{title}
                p Cricket fantasy game where you can be selector.
                a.btn(data-toggle="modal", href="#myModal") Launch


div.modal.hide(id="myModal")
    .modal-header
        button(type="button", class="close", data-dismiss="modal") x
        h3 Modal Header
    .modal-body
        p One fine body...
    .modal-footer

This is my layout.jade file

!!!
html
    head
        title= title
        link(rel='stylesheet', href='/libs/bootstrap/css/bootstrap.css')
        link(rel='stylesheet', href='/libs/bootstrap/css/bootstrap.min.css')
        link(rel='stylesheet', href='/libs/bootstrap/css/bootstrap-responsive.min.css')
        link(rel='stylesheet', href='/stylesheets/style.css')
    body!= body
script(src="/libs/bootstrap/js/bootstrap.js")

I have other bootstrap elements working but cannot follow the following instructions - "You can activate modals on your page easily without having to write a single line of javascript. Just set data-toggle="modal" on a controller element with a data-target="#foo" or href="#foo" which corresponds to a modal element id, and when clicked, it will launch your modal."

How can i do that ?

Assuming you have the bootstrap-modal.js (either in the full js or separate) that should work as far as I can see. — Adam Hopkinson
But when you downloaded bootstrap, did you check the boxes to include all the js components? — Adam Hopkinson

diesel diesel · Accepted Answer · 2013-02-28T13:50:58

Include jquery lib in the layout.jade file

How to get twitter bootstrap modal working in node js express js?

2 Answers