Modal solo muestra fondo oscuro

Question

Estoy tratando de crear un código de bootstrap Modal dentro de un proyecto ROR.Estoy usando el inicio de sesión del verbo, pero no usando el dispositivo.Solo estoy tratando de averiguar el modal sin la complejidad de agregar ¡Idear!

Parece que llegue al servidor después de hacer clic en el enlace de inicio de sesión, ¡pero solo tengo una superposición gris!

application.htm.erb

 <div class="container">
  <div class="well">
   <%= link_to 'login', login_url,
   {:remote => true,
    'data-toggle' =>  "modal",
     'data-target' => '#login',
      :class => "btn btn-primary "} %>
     </div>
  </div>
  <div id="login" class="modal hide fade"></div>

_LOGIN.HTML.ERB

<div class="modal hide fade in" id="login">
  <div class="modal-header">
    <button class="close" data-dismiss="modal">x</button>
    <h2>Sign in</h2>
  </div>
  <div class="modal-body">
    <h2>Login form will go here</h2>
  </div>
  <div class="modal-footer">modal footer text</div>
</div>

login.js.erb

$("#login-modal").html("<%= escape_javascript(render 'login') %>")
$("#login-modal").modal("show")

Sitio # Iniciar sesión

def login
  respond_to do |format|
     format.js
   end
end 

Salida de la consola

Comience a obtener "/ Iniciar sesión" para 127.0.0.1 en 2014-07-28 16:38:59 -0700

Procesamiento por SiteController # Inicia sesión como JS

sitio rendido / _login.html.erb (0.0ms)

Sitio procesado / LOGIN.JS.ERB (1.0ms)

Answer 1

El marcado de su modal parece incorrecto.Parece que lo tomaste de un viejo ejemplo de bootstrap 2?Compáralo contra los ejemplos en http://getbootstrap.com/javascript/#modals .

Los problemas en su código incluyen:

• No debe usar las clases de hide o in
• Falta modal-dialog y modal-content <div>s

¿Qué recurso / ejemplo basó su código de?