Question

在产品索引页面中，我列出了所有产品的名称。我还有一个表单来创建一个新产品。当我提交表单时，我可以创建一个新产品，但在刷新页面之前，产品列表不会更新。

我将此作为参考：http://guides.rubyonrails.org/v4.2/working_with_javascript_in_rails.html

产品索引：

<ul class="updated_products"><%= render 'products' %></ul>


<%= form_for(@product, remote: true) do |f| %>

  <div class="field">
    <%= f.label :name %><br>
    <%= f.text_field :name %>
  </div>
  <div class="field">
    <%= f.label :description %><br>
    <%= f.text_field :description %>
  </div>
  <div class="field">
    <%= f.label :price %><br>
    <%= f.text_field :price %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

<%= link_to 'New Product', new_product_path %>

<script>
$('#new_product').bind('ajax:success', function(){
  this.reset();
$(".updated_products").html("<%= escape_javascript(render 'products') %>") ; 
});

</script>

产品部分：

<% @products.each do |product| %>
    <li><%= product.name %></li>
<% end %>

产品控制器：

  def index
    @products = Product.all
    @product = Product.new
  end

  def create
    @product = Product.new(product_params)
    #@product = Product.new(params[:product])

    respond_to do |format|
      if @product.save
        format.html { redirect_to @product, notice: 'Product was successfully created.' }
        format.json { render :show, status: :created, location: @product }
      else
        format.html { render :new }
        format.json { render json: @product.errors, status: :unprocessable_entity }
      end
    end
  end

create.js.erb：

$("<%= escape_javascript(render 'products') %>").appendTo(".updated_products);

更新

将format.js {}添加到respond_to后，我可以在我的日志中看到它正在运行：

产品负荷（0.0ms）选择“产品”。* FROM“产品” 渲染产品/ _products.html.erb(5.0ms）渲染产品/ create.js.erb（9.0ms）

但它仍未在页面上更新。

我确定问题是我的create.js.erb文件的内容：

$(".updated_products").html("<%= escape_javascript(render 'products') %>") ;

固定

在视图中，我更改了ul，将产品部分从updated_product类转换为id。也在create.js.erb文件中更改了它

查看：

<ul id="updated_products"><%= render 'products' %></ul>

create.js.erb

$("#updated_products").html("<%= escape_javascript(render 'products') %>") ;

控制器对Ajax请求的响应

0 个答案: