title: Modal content override by data-remote in Twitter Bootstrap
body: <p>I'm trying to show a remote content inside a <code>modal</code> using Twitter Bootstrap with this code:</p>
  
  <pre><code>&lt;ol class="breadcrumb text-right"&gt;
      &lt;li&gt;&lt;a data-target="#modal" data-toggle="modal" data-remote="/app_dev.php/resetting/request" href="#"&gt;Forgot password?&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="#modal" data-toggle="modal" data-remote="/app_dev.php/registro" href="#"&gt;Register&lt;/a&gt;&lt;/li&gt;
  &lt;/ol&gt;
  
  &lt;div aria-hidden="true" aria-labelledby="modalLabel" role="dialog" tabindex="-1" id="modal" class="modal fade"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;button data-dismiss="modal" class="close" type="button"&gt;&lt;span aria-hidden="true"&gt;×&lt;/span&gt;&lt;span class="sr-only"&gt;Close&lt;/span&gt;&lt;/button&gt;
                  &lt;h4 id="myModalLabel" class="modal-title"&gt;Alert&lt;/h4&gt;
              &lt;/div&gt;
              &lt;div class="modal-body"&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;   
  </code></pre>
  
  <p>When I click on any link that trigger modal, like this image:</p>
  
  <p><img src="https://i.stack.imgur.com/QCiIB.jpg" alt="enter image description here"></p>
  
  <p>But then, when content is loaded, I lost the modal setup and the remote content replaces the complete modal layout, like this image:</p>
  
  <p><img src="https://i.stack.imgur.com/VMxgn.jpg" alt="enter image description here"></p>
  
  <p>What I'm doing wrong?</p>
  
  <p><strong>Look in code generated by remote call</strong></p>
  
  <p>I take a closer look to the modal after it loads and just the <code>&lt;div class="modal-header"&gt;...&lt;/div&gt;</code> dissapear and I don't know the cause. This is the code for the modal after it loads the remote content:</p>
  
  <pre><code>&lt;div aria-hidden="false" aria-labelledby="modalLabel" role="dialog" tabindex="-1" id="modal" class="modal fade in" style="display: block;"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;form id="fos_user_resetting_request" class="fos_user_resetting_request form_registro" method="POST" action="/app_dev.php/resetting/send-email"&gt;
                  &lt;h2&gt;Solicitar nueva contraseña&lt;/h2&gt;
                  &lt;div&gt;
                              &lt;label for="username"&gt;Nombre de usuario:&lt;/label&gt;
                      &lt;input type="text" required="required" name="username" id="username"&gt;
                      &lt;input type="submit" value="Restablecer contraseña" id="reset_btn"&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
  
              &lt;script&gt;
                  $(document).ready(function() {
                      $("#fos_user_resetting_request").submit(function(e) {
                          e.preventDefault();
                          $.ajax({
                              type: "POST",
                              cache: false,
                              url: "/resetting/send-email",
                              data: $(this).serializeArray(),
                              success: function(data) {
                                  $.fancybox(data);
                              }
                          });
                      });
                  });
              &lt;/script&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Any advice?</p>