【问题标题】:exact steps to display bootstrap modal in rails application在 Rails 应用程序中显示引导模式的确切步骤
【发布时间】:2012-04-06 12:26:26
【问题描述】:

我似乎找不到任何关于为什么我的模式不显示的答案,所以我认为应该检查基础知识。我已经实现了以下结构,但没有弹出模式。请帮忙

1) 索引页面有一个调用控制器编辑操作的链接

<%= link_to 'Edit business', edit_user_business_path(@u, b), {:remote => true, 'data-controls-modal' =>  "modal-window", 'data-backdrop' => true, 'data-keyboard' => true, :class => "btn btn-primary ", :id => 'edit_biz'} %>

2) 控制器的编辑操作执行此操作(缩短):

respond_to do |format|
    format.html  {render :edit}
    format.json { head :ok}
  end

3) Edit.html.erb 看起来像这样:

<div class="modal hide fade" id="modal-window">
  <div class="modal-header">
    <a href="#" class="close">×</a>
    <h6>Loading...</h6>
  </div>

  <div class="modal-body center">

    <h2>Edit business </h2>
    <%= render 'editbusiness' %>
  </div>

  <div class="modal-footer">&nbsp;
  </div>
</div>

4) _editbusiness.html.erb 有以下内容

<fieldset>
<br/>
<br/>
<%= form_for @businesses_to_edit, :url => { :action => "edit"}, :class => "form-horizontal" do |biz| %>
    <p>
        <%=  biz.label :name, :class => "span3"%>
        <%=  biz.text_field(:name, :placeholder => biz.object.name, :class => "span3")%>
    </p>

    <p>
        <%=  biz.label :description, :class => "span3" %>
        <%=  biz.text_field(:description, :placeholder => biz.object.description, :class => "span3")%>
    </p>

    <br/>
    <br/>
    <br/>
    <div class="form-inline pull-right">
        &nbsp;&nbsp;<%=  biz.submit "Save", :class => "btn btn-inverse span1", :id => 'edit_biz' %>
        &nbsp;&nbsp;<%=  biz.button "Close", :class => "span1", :id => 'close' %>
    </div>

    <% end %>


    </fieldset>

5) 最后,application.js 有这个:

//= require jquery
//= require jquery_ujs
//= require_tree .
//= require bootstrap


$(document).ready(function() {

$('#modal-window').modal('show')   ;
$('.modal-body').html('<%= escape_javascript(render :partial => "editbusiness", :object => @businesses_to_edit) %>');

});

【问题讨论】:

  • 我的第一个想法是您在javascript文件中使用ERB,这不是erb模板。
  • 您是否得到了答案或解决方案?有同样的问题!
  • 能否请您添加您的解决方案

标签: ruby-on-rails modal-dialog twitter-bootstrap


【解决方案1】:

也许您需要在您的application.js 中包含此字符串:

//= require bootstrap-modal

【讨论】:

  • 花了 3 天时间寻找自定义确认对话框后,我找到了您的解决方案。非常感谢。
猜你喜欢
  • 2015-07-03
  • 2019-11-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-11-07
  • 1970-01-01
  • 2019-06-30
相关资源
最近更新 更多