我有一个ruby应用程序设置,在每个页面上呈现一个导航栏,这是我的application.html.erb页面
<html>
<head>
<title>Title</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<%= render 'layouts/header' %>
<div class="container">
<% flash.each do |name, msg| %>
<%= content_tag(:div, msg, class: "alert alert-info") %>
<% end %>
<%= yield %>
</div>
</body>
</html>
我的主页设置如此,之前的模态形式,我已设计处理新的用户路径。
<div class="jumbotron center">
<h1>Welcome to my app</h1>
<% if user_signed_in? %>
#do something
<% else %>
<p>
<%= link_to "Log in", new_user_session_path, class: "btn btn-default btn-lg" %>
<%= link_to "Sign up", new_user_registration_path , class: "btn btn-primary btn-lg", :data => {:toggle=>"modal", :target=>"#myModal"} %>
</p>
<% end %>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</div>
我的问题是,无论何时点击注册按钮启动模态,导航栏都会显示在模态框的顶部,最终看起来像这样: http://i.imgur.com/dvh3TzM.jpg 有人知道如何阻止导航栏在这些模态弹出窗口中渲染吗?
答案 0 :(得分:0)
<% if params[:controller]!="login_controller_name" %>
<%= render 'layouts/header' %>
<% end %>
可以根据您的设置而有效。只要调用它的视图通过登录控制器导航,这将阻止您的标题显示。如果你不希望整个控制器避免显示标题,那么每当你显示弹出窗口时你应该能够传递某种形式的参数并且同样的计划可以工作,你只需要使用{{1相反。
params[:supplied_param]
也可能适合您。
答案 1 :(得分:0)
您要做的是限制加载到模态中的HTML;它目前正在加载链接href
指定的整个页面。你应该能够做到这一点(我只是将它分成几行来进行更漂亮的格式化):
<%= link_to "Sign up", new_user_registration_path, {
class: "btn btn-primary btn-lg",
data: {
toggle: "modal",
target: "#myModal",
remote: "#{ new_user_registration_path } .container"
}
} %>
Bootstrap模式使用href
(或data-remote
if present)属性作为jQuery .load()
的第一个arg。
您可能希望将.container
更改为登录页面的其他选择器。