AJAX 使用 Rails 3.2 提交表单

Question

这是我的表单，它工作正常，但现在我想对其进行 AJAX。

<%= form_tag variant_path(variant.id), :method => :put, :class => 'update_inv_form' do %>  
  <%= text_field_tag :inventory_quantity, variant.inventory_quantity %>
  <%= submit_tag 'Update'  %>
<% end %>

当我添加 :remote => true 属性时，表单通过 AJAX 成功提交（我可以看到它发生在服务器上，刷新页面时我可以看到更改）。我想正确更新视图以显示更改而不刷新页面。这是我的更新操作：（请注意，我在这里没有使用 ActiveRecord 模型。）

def update
  variant = ShopifyAPI::Variant.find(params[:id])
  variant.inventory_quantity = params[:inventory_quantity]
  variant.save
  redirect_to root_path
end

更新 感谢您帮助我解决这个问题的答案原来解决方案与他所说的完全一样，但是我遇到了一个小问题。我想更新的视图位于app/views/home/index.html.erb，我正在处理这个：Variants#update。 （变体控制器，更新操作）

我将 update.js.html 放在与我的视图相同的目录中：app/views/home，而我的服务器抛出 500 错误：缺少模板。结果，我必须创建一个app/views/variants/ 目录并将update.js.html 文件放在那里。问题解决了。

Answer 1

您需要更改您的操作以响应 JS 格式：

def update
  @variant = ShopifyAPI::Variant.find(params[:id])
  @variant.inventory_quantity = params[:inventory_quantity]
  @variant.save

  respond_to do |format|
    format.html { redirect_to root_path }
    format.js
  end
end

然后您可以使用 JavaScript 创建一个 update.js.erb 文件来更新页面。假设您有一个 _variant.html.erb 部分，您可以将变体附加到这样的 div 中（假设您使用的是 jQuery）：

$('.variant-list').append('<%= escape_javascript(render(:partial => "variant", :object => @variant)) %>');

更新

这是一个如何使用 update.js.erb' file (Note: I have not tried this code). Let's say you have the following code in yourindex.html.erb` 的示例：

<ul class="variants">
    <li id="101">Variant 1</li>
    <li id="102">Variant 2</li>
    <li id="103">Variant 3</li>
</ul>

您的updated.js.erb 可能如下所示：

$('.variants #<%= @variant.id %>').text('<%= @variant.title %>');

这样做是在列表中找到您刚刚更新的变体，并将变体标题更改为新的。