Rails page loads modal-backdrop twice?
Question
When I close the modal (click outside the modal), the webpage is still dark, and I have to click a second time somewhere on the page for it to be normal again. Anyone knows what the problem might be?
_post_modal.html.erb
<div id="<%= p.id %>" class="modal hide" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<p><h3 id="myModalLabel"><%= p.title %></h3></p>
</div>
<div class="modal-body">
<%= raw(p.link) %>
</div>
</div>
_single_post.html.erb
<% @posts.each do |p| %>
<%= render "post_modal" %>
<% end %>
list.html.erb
<div class="container">
<%= render 'single_post' %>
</div>
application.html.erb
<body>
<%= link_to('Logout user', destroy_user_session_path, :method => :delete) %>
<%= link_to('Logout admin', destroy_admin_session_path, :method => :delete) %>
<%= yield %>
</body>
custom.css.scss
body{
background-image:url('dark_leather.png');
color: #333;
font-family: verdana, arial, helvetica, sans-serif;
line-height: 18px;
}
.container{
vertical-align: center;
}
.modal{
h3{
font-family: 'Josefin Slab', serif;
font-size: 18pt;
font-weight: 400;
color: #34DDDD;
}
}
2 answers
solution1
3 2013-05-25 18:38:22
Hide the modal before doing the ajax request. I had the same problem and that solved it. With me it was more of an issue of replacing the container that contained the actual modal window.
If that doesn't work you can always force it to go away by doing the following:
$('#your-modal-id').modal('hide');
$('body').removeClass('modal-open');
$('.modal-backdrop').remove();
solution2
0 ACCPTED 2013-05-27 14:38:45
After hours of googleing and reading, I found a solution.
I first found this , that lead me to this , that lead me to this . (Useful because it gives alternative solutions and explanations).
In short:
1) First I added this: config.serve_static_assets = false to my config/environments/development.rb file.
2) Then I ran the rake assets:clean command in terminal.
3) And finally i deleted the cache in my browser.
It worked - and why it worked, is a long explanation written in the links above ;)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.