Modal mostra solo sfondo scuro
-
20-12-2019 - |
Domanda
Sto cercando di creare un bootstrap modale all'interno di un progetto ROR.Sto usando il login del verbo, ma non usare idei.Sto solo cercando di capire il modale senza la complessità di aggiungere Digitare!
Mi sembra di raggiungere il server dopo aver fatto clic sul link di accesso ma ottengo solo la sovrapposizione grigia!
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")
.
Sito # login
def login
respond_to do |format|
format.js
end
end
.
Uscita console
Iniziato GET "/ LOGIN" per 127.0.0.1 al 2014-07-28 16:38:59 -0700
Elaborazione da SiteController # Accedi come JS
Sito reso / _login.html.erb (0.0ms)
rendering sito / login.js.erb (1.0ms)
Soluzione
Il markup del tuo modal sembra errato.Sembra che tu l'abbia preso da un vecchio esempio di bootstrap 2?Confrontalo contro gli esempi in http://getboowstrap.com/javascript/#modals . I problemi nel tuo codice includono:
- .
- Non dovresti usare le classi
hide
oin
- Manca
modal-dialog
emodal-content
<div>
s
Quale risorsa / esempio hai basato il tuo codice di spento?