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 %>

当我添加了:遥控=> 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

然后,您可以update.js.erb使用JavaScript 创建一个将更新页面的文件.假设您有_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 %>');

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