Bootsrap 模式未出现在 Rails 应用程序中

用户3576036

我正在示例 Rails 应用程序的设计视图上实现 jquery。在我在生产代码上实现它之前,我想首先在示例应用程序上尝试它。

我有一个欢迎控制器和视图

route.rb如下

get 'welcome/index'
devise_for :users
root 'welcome#index'

而对于这两个部分的模板register,并login在下列文件中的谎言如下:

应用程序/视图/欢迎/_login_modal.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">

<%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %>

<div><%= f.label :email %><br />

<%= f.email_field :email, :autofocus => true %></div>

<div><%= f.label :password %><br />

<%= f.password_field :password %></div>

<% if devise_mapping.rememberable? -%>

<div><%= f.check_box :remember_me %> <%= f.label :remember_me %></div>

<% end -%>

<%= f.submit "Sign in", :class => 'btn btn-small btn-success' %>
<% end %>

</div>

<div class="modal-footer">

<%= render "devise/shared/links" %>

</div>

</div>

我已经在application.html.erb文件本身中添加了我的 javascript 代码

<!DOCTYPE html>
<html>
<head>
  <title>PopupDevise</title>
<%= link_to "Login", "#login", "data-toggle" => "modal", :class => 'btn btn-small' %>

<%= link_to "Sign up", "#sign_up", "data-toggle" => "modal", :class => 'btn btn-small btn-success' %>

  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
    <script type="text/javascript"> $(function ()

    { $("#myModal").modal({show:false }); </script>
</head>
<body>
<%= render "welcome/login_modal" %>

<%= render "welcome/sign_up_modal" %>

<%= yield %>

</body>
</html>

现在,当我运行时,rails s一切都可见。当我点击LoginSign Up按钮时,屏幕变为透明灰色,但我没有看到任何弹出窗口。我在 js 或 jquery 部分还没有那么好仍在学习。有人可以告诉我如何解决这个问题吗?

苏拉杰

我可以帮你解决这个问题。

从行中删除hidein

<div class="modal hide fade in" id="login">

当您单击“登录”按钮时,您应该能够看到模态。

还要删除里面的波纹管脚本标签,<head> </head>因为您没有使用带有 id 的模态myModal

<script type="text/javascript"> $(function ()

{ $("#myModal").modal({show:false }); </script>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Google字体未出现在Rails中

来自分类Dev

应用程序未出现在Dash中(14.04)

来自分类Dev

应用程序未出现在Dash中(14.04)

来自分类Dev

Rails 4-背景图像出现在Localhost中,但未出现在生产环境中

来自分类Dev

无法使Datepicker样式出现在我的Rails应用程序中

来自分类Dev

Sidekiq作业不断出现在Rails应用程序中

来自分类Dev

我希望我的轮播仅在Rails应用程序中出现在索引页面中

来自分类Dev

Android应用程序图标未出现在应用程序列表中

来自分类Dev

带有 bootsrap 的 rails 应用程序中的不同 jQuery/JS 错误

来自分类Dev

某些程序未出现在“应用程序”菜单中

来自分类Dev

Admob广告未出现在已发布的应用中。在测试模式下工作正常

来自分类Dev

按钮未出现在JFrame中

来自分类Dev

MBean未出现在JConsole中

来自分类Dev

菜单未出现在片段中

来自分类Dev

模态未出现在刷新中

来自分类Dev

图例未出现在ggplot中

来自分类Dev

标题未出现在Firefox中

来自分类Dev

按钮未出现在JFrame中

来自分类Dev

网站未出现在iframe中

来自分类Dev

图像未出现在PFQueryCollectionViewController中

来自分类Dev

Windows未出现在GRUB中

来自分类Dev

图像未出现在JFrame中

来自分类Dev

职位未出现在“职位”中

来自分类Dev

值未出现在Datagrid中?

来自分类Dev

滴答未出现在ggplot中

来自分类Dev

已发布的ClickOnce应用程序未出现在“开始”菜单中

来自分类Dev

应用程序未出现在Android模拟器中

来自分类Dev

Spark setAppName未出现在Hadoop运行的应用程序UI中

来自分类Dev

ggiraph图未出现在闪亮的应用程序中,但可在RStudio中使用