title: Unable to load Bootstrap Modal via Ajax
body: <p>I have my html code as:</p>
  
  <pre><code>&lt;button class="btn btn-default" id="openForm"&gt;
          New           
  &lt;/button&gt;
  
  &lt;!-- Modal --&gt;
  &lt;div class="modal fade hide" id="formModal"&gt;
    &lt;div class="modal-header"&gt;
      &lt;h4&gt;
          Form
      &lt;/h4&gt;
    &lt;/div&gt;
  
    &lt;div class="modal-body" id="formModalBody"&gt;
    &lt;/div&gt;
  
    &lt;div class="modal-footer"&gt;
      &lt;a href="#" data-dismiss="modal" class="btn"&gt;Close&lt;/a&gt;        
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>My Java script reads as:</p>
  
  <pre><code>$(document).on('click', '#openForm', function(e) {
  e.preventDefault();
  
  $("#formModalBody").html("");
  $("#formModal").modal('show');
  
  $.post('index.php/customers/view/-1/',
          {id: -1},
          function (html) {
              $("#formModalBody").html(html);
          }
      );
  });
  </code></pre>
  
  <p>I am using Twitter Bootstrap &amp; Codeignitor. The post url above is index.php/Controller/function</p>
  
  <p>When I am clicking on the button; I am not able to see the Bootstrap Modal. The page fades in, but there is no modal visible.</p>