rails 4 bootstrap 3模态对话框:奇怪的布局渲染

时间:2015-09-04 08:43:07

标签: ruby-on-rails ruby-on-rails-4 twitter-bootstrap-3 devise

使用Devise登录的My Bootstrap模式以一种奇怪的方式呈现: modal

我在application_controller.rb中插入了来自twitter-bootstrap-rails的bootstrap助手:

<%= modal_dialog id: "signin",
         header: { show_close: true, dismiss: 'modal', title: 'Modal header' },
         body:   { content: 'This is the body' },
         footer: { content: content_tag(:button, 'Save', class: 'btn') } %>

或尝试使用普通的HTML:

<div id="signin" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

两者的渲染方式与上图相同。 日志说:

I, [2015-09-04T10:13:45.228876 #7182]  INFO -- : Started GET "/users/sign_in.js" for xx.xx.xx.xx at 2015-09-04 10:13:45 +0200
I, [2015-09-04T10:13:45.237032 #7182]  INFO -- : Processing by SessionsController#new as JS
I, [2015-09-04T10:13:45.256132 #7182]  INFO -- :   Rendered devise/sessions/_signin.html.erb (0.1ms)
I, [2015-09-04T10:13:45.259590 #7182]  INFO -- :   Rendered devise/sessions/_signin.html.erb (0.1ms)
I, [2015-09-04T10:13:45.261021 #7182]  INFO -- :   Rendered mailgroups/_mailgroup_append.html.erb (0.1ms)
I, [2015-09-04T10:13:45.264283 #7182]  INFO -- :   Rendered devise/sessions/_signin.html.erb (0.1ms)
I, [2015-09-04T10:13:45.264459 #7182]  INFO -- :   Rendered devise/sessions/new.js (11.7ms)
I, [2015-09-04T10:13:45.264907 #7182]  INFO -- : Completed 200 OK in 28ms (Views: 25.5ms | ActiveRecord: 0.0ms)

我的sessions_controller.rb是:

class SessionsController < Devise::SessionsController

  respond_to :js

  def new
    super
  end

  def create
    super
  end

  def destroy
    super
  end

  def failure
    logger.debug "failure in devise sessions_controller"
  end

end    

/views/devise/sessions/new.js如下所示:

$("#signin").modal()

文件/views/devise/sessions/_signin.html.erb为空(我喜欢将application_controller.rb中的模态代码放在那里,一旦渲染好了。)

我的问题是:

  1. 我做错了什么(在sessions_controller中有很大的不确定性)?
  2. 为什么设计/ sessions / _signin.html.erb 呈现3次(如日志所示,目前它是空的,但当我在那里放一些代码时,它被执行多次......)
  3. 如果我移动模态代码 application_controller到_signin.html.erb,我需要放什么 进入application_controller.rb? (例如)

1 个答案:

答案 0 :(得分:0)

多么令人尴尬...... 在搜索了3个小时之后,我在application.css.less中找到了我的#signin id的剩余定义,这搞定了布局。

抱歉让你们忙碌,感谢Ruby Racer指出我正确的方向。这确实是一个CSS问题。