Rails 4 JavaScript / JQuery通过编辑控制器动作呈现多个局部

Question

我正在尝试使用相同的编辑控制器操作在同一索引视图上获取多个局部。

基本上，我希望用户输入ID和运输数量的列表。 部件具有带有更新按钮的两种形式输入。 但是，当我尝试按以下方式使用局部变量时，无论我为表列设置了哪个js ID，无论单击哪个“编辑”链接，我都将同时显示两个局部变量。

我在控制器中的编辑操作：

def edit
  @invoice = Invoice.find(params[:id])
   respond_to do |format|
    format.js
    format.html
    end
 end

我的索引视图的一部分：

<% @invoices.each do |invoice| %>
  <td id="packlist"><%= invoice.readpacklistid %><%= link_to 'Edit', edit_invoice_path(invoice), :remote => true %></td>
  <td id="shipqty"><%= invoice.shippedqty %><%= link_to 'Edit', edit_invoice_path(invoice), :remote => true %></td>
<% end %>

我的edit.js.erb包含：

$('#shipqty').append( "<%= escape_javascript( render(:partial => 'shippedqty', :locals => {'invoice' => @invoice}) ) %>");
$("#packlist").append( "<%= escape_javascript( render(:partial => 'packlist', :locals => {'invoice' => @invoice}) ) %>");

_shippedqty.html.erb部分包含：

<%= form_for(@invoice) do |f| %>
  <%= f.label :shippedqty %>
  <%= f.select :shippedqty, options_for_invoices(@invoice.customerorderid) %>
  <%= f.submit %>
  <%= link_to "Cancel", invoices_path %>
<% end %>

_packlist.html.erb

<%= form_for(@invoice) do |f| %>
  <%= f.label :packlistid %>
  <%= f.select :packlistid, options_for_packlistid(@invoice.customerorderid, @invoice.shippedqty), :selected => :packlistid %>
  <%= f.submit %>
<% end %>

我希望这两个部分都显示在同一页面上，但单击它们所需的链接时一次显示一个。 我发现对用户而言，它比单击链接一次编辑所有内容更为有益。

这是使用Rails 4.1.8和Ruby 2.1.0p0

任何帮助是极大的赞赏。

谢谢！

Answer 1

我终于想出了一种简便的方法。

Invoices.helper

def options_for_shippedqty(customerid)
  Shipperline.getshippqty(customerid)
end

#Used to get all the packlistid for a invoice record for drop down select

def options_for_packlistid(customerid, shipqty)
 Shipperline.packlist(customerid, shipqty)
end

那在我看来

<%= form_for invoice do |f| %>
   <% @packlistFromList = options_for_packlistid(invoice.customerID,     invoice.shippedqty).first %>
 <% if @packlistFromList.nil? %>
   <td id="putcolor"><%= f.text_field :packlistid %><%= f.submit "Update  Packlist", { :class => "btn btn-primary" } %>
 <% else %>
   <td id="putcolor"><%= f.select :packlistid, options_for_packlistid(invoice.customerID, invoice.shippedqty) %><%= f.submit  "Update Packlist", { :class => "btn btn-primary"} %></td>
 <% end %>
  <% @shipQty = options_for_shippedqty(invoice.customerID).first %>
 <% if @shipQty.nil? %>
  <td id="putcolor"><%= f.text_field :shippedqty %><%= f.submit "Update Shipping QTY", { :class => "btn btn-primary" } %>
 <% else %>
  <td id="putcolor"><%= f.select :shippedqty, options_for_shippedqty(invoice.customerID) %><%= f.submit "Update Shipping QTY", { :class => "btn btn-primary"} %></td>
 <% end %>
  <td id="putcolor"><%= invoice.adder %></td>
  <td id="putcolor"><%= invoice.adderprice %></td>
  <td id="putcolor"><%= invoice.difference %></td>
  <td id="putcolor"><%= f.text_area :comments %><%= f.submit "Add Comment",  { :class => "btn btn-primary"} %></td>
  <td id="putcolor"><%= f.check_box :completed %><%= f.submit "Submit   Completion", { :class => "btn btn-primary"} %></td>
  <td class="hidden"><%= invoice.orgShippedQty %></td>
  <td class="hidden"><%= invoice.getPrecMetalAmount %></td>
  <td class="hidden"><%= invoice.orgPackList %>
  <td class="hidden"><%= invoice.invoiceNum %>
 </tr>
</tbody>
<% end %>
<% end %>

Answer 2

我请你，从AJAX渲染Partial，我向自己解释：

• 用户单击编辑时，必须对相应的动作编辑进行ajax调用。
• 此操作应返回一个html代码（窗体）。
• 将此HTML代码附加到AJAX成功参数中所需的位置。 （使用$ jquery.html）
• 使用后删除表格。

要么

<% @invoices.each do |invoice| %>
  <td id="'packlist'+@invoice.id"><%= invoice.readpacklistid %><%= link_to 'Edit', edit_invoice_path(invoice), :remote => true %></td>
  <td id="'shipqty'+@invoice.id"><%= invoice.shippedqty %><%= link_to 'Edit', edit_invoice_path(invoice), :remote => true %></td>
<% end %>

和

$('#shipqty+@invoice.id').append( "<%= escape_javascript( render(:partial => 'shippedqty', :locals => {'invoice' => @invoice}) ) %>");
$("#packlist+@invoice.id").append( "<%= escape_javascript( render(:partial => 'packlist', :locals => {'invoice' => @invoice}) ) %>");

Answer 3

在您的edit.js.erb文件中，您要渲染两个文件，这就是为什么要同时获取两个文件的原因。
甚至您也无法在编辑操作中确定单击了哪个链接，因为您没有发送任何东西来分隔两个链接。

每当用户单击这些链接中的任何一个时，您都需要在参数中发送一些标识符，然后在edit.js.erb中根据这些参数条件使用if / else来确定需要渲染的文件。