访问视图作为模态

时间:2012-11-23 08:44:39

标签: ruby-on-rails modal-dialog

我正在尝试访问我的一个编辑视图作为我的应用程序中的模式。我的Show.html读数如图所示

<%- model_class = Reading -%>
<div class="page-header">
<h1><%=t '.title', :default => model_class.model_name.human %></h1>
 </div>

<dl class="dl-horizontal">
  <dt><strong><%= model_class.human_attribute_name(:customer_id) %>:</strong></dt>
    <dd><%= @reading.customer_id %></dd>
  <dt><strong><%= model_class.human_attribute_name(:date_of_reading) %>:</strong></dt>
    <dd><%= @reading.date_of_reading %></dd>
  <dt><strong><%= model_class.human_attribute_name(:reading1) %>:</strong></dt>
    <dd><%= @reading.reading1 %></dd>
  <dt><strong><%= model_class.human_attribute_name(:reading2) %>:</strong></dt>
    <dd><%= @reading.reading2 %></dd>
  <dt><strong><%= model_class.human_attribute_name(:reading3) %>:</strong></dt>
    <dd><%= @reading.reading3 %></dd>
</dl>

<div class="form-actions">
   <%= link_to t('.back', :default => t("helpers.links.back")),
          customer_readings_path, :class => 'btn'  %>
   <%= link_to t('.edit', :default => t("helpers.links.edit")),
          edit_customer_reading_path(@reading.customer, @reading), :class => 'btn', :data => {:toggle => "modal", :target => "#editItemModal"} %>
   <%= link_to t('.destroy', :default => t("helpers.links.destroy")),
          customer_reading_path(@reading.customer),
          :method => 'delete',
          :data => { :confirm => t('.confirm', :default => t("helpers.links.confirm",  :default => 'Are you sure?')) },
          :class => 'btn btn-danger' %>
</div>

在我的编辑视图,阅读/编辑

<div id= "editItemModal" class="modal hide fade" tabindex="-1" role="dialog">
<button type="button" class="close" data-dismiss="modal">x</button></h1>
<div class = "page-header">
<h1> Editing Readings </h1>
</div>

<%= render 'form_reading'%>
</div>

但是,在我的节目中单击编辑时,编辑视图不会显示为模式,它只显示空白页面。我能错过什么?

1 个答案:

答案 0 :(得分:0)

1)首先,您需要添加:remote => true来对编辑链接进行调整。

2)这个div需要在显示页面上。(只有div而不是里面的内容。)

<div id= "editItemModal" class="modal hide fade" tabindex="-1" role="dialog">

</div>

3)将edit.html.erb更改为_edit.html.erb

,使$('#link_id').on('ajax:success', function(e, data){ $('#editItemModal').html(data); }); 成为部分

4)在展会页面上添加此javascript代码

render 'edit', :layout => false

5)在您的控制器编辑操作中写下此{{1}}

此代码中可能存在一些拼写错误或小错误。但我已经多次使用它了。所以我建议你试试这个。