How to call bootstrap modal with Javascript and pass variables

Question

Possible Duplicate:
How to pass values arguments to modal.show() function in twitter bootstrat

I have a simple Bootstrap modal from tutorial:

<div id="modal-custom-id" class="modal hide fade">
 <div class="modal-header">
  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
  <h3>Modal header</h3>
  </div><div class="modal-body">
   <p>One fine body…</p>
  </div>
  <div class="modal-footer">
  <a href="#" class="btn">Close</a>
 </div>
</div>

And I have a Leaflet marker, to which I add a custom click function:

marker.on('click', function(e) {
   ...
}

How to write a click function witch will call and show Bootstrap model and fill it with custom title and body?

Answer 1

you can navigate the DOM and change the values before showing the modal. Using your example you may have something like:

marker.on('click', function(e) {
   $("#modal-custom-id .modal-header h3").html("New Title"):
   $("#modal-custom-id .modal-body p").html("New Body"):
   $("#modal-custom-id").modal("show");
}