Question

在我的网上商店中，我有一个远程表格来处理产品的退货'。

到达此页面并且如果我选择一个项目，则表单将返回此错误。重新加载页面后，错误消失并且表单开始工作。

VM1138 returning_items:1 Uncaught TypeError: Cannot read property 'submit' of null
    at HTMLSelectElement.onchange (VM1138 returning_items:1)

returning_items / index.html.erb

<table class="table">
    <tbody>
      <% @returning_items.each do |item|%>
        <%= form_with model: @item, method: :patch, remote: true, html: { class: "update-form"} do |f| %>
            <tr class="mulitple-item">
             <td><%= image_tag item.order_item.variant.product.attachments.first.url, class: "small_image" %></td>
             <td> 
                 <%= f.select :quantity, 
                    options_for_select((0..item.order_item.quantity),
                    selected: item.quantity, 
                    value: item.quantity),
                    {},
                    { 
                     class: 'form-control select-qty',
                     onchange: 'this.form.submit();' 
                    } %>
             </td>
            </tr>
        <% end %>
      <% end %>
    </tbody>
  </table>

这是我的 returning_items_controller.rb

中的更新操作

def update
  @order = Order.find(params[:order_id])
  find_returing
  @returning_item = ReturningItem.find(params[:id])
  @returning_item.update_attributes(returning_item_params)
  @order = Order.find(params[:order_id])
  find_returing
   @returning_item = ReturningItem.find(params[:id])
    respond_to do |format|
        if  @returning_item.update_attributes(returning_item_params)
         format.js
         format.html {redirect_to clients_order_returning_returning_items_path(@order, @returning), notice: "Ca marche"}
        else
         format.js
         format.html {redirect_to clients_order_returning_returning_items_path(@order, @returning), alert: "C'est marche pas"}
        end
     end
end

<div class="row">

  <table class="table">
    <tbody>
      <tr class="mulitple-item">
        <form class="update-form" action="/clients/orders/46/returnings/144/returning_items" accept-charset="UTF-8" data-remote="true" method="post"></form><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="+Bg9P/GGOnvlw6bjPnQJ0HWIcEWJfJM+BktJPYNTRU5NQ2mj9Vads3YBvinD6wRed2sRA6MYUh5L7pQASZnoww==">

        <td><img class="small_image" src="/uploads/product/attachments/9/pull_beige_1.jpg"></td>
        <td>2</td>
        <td>
          Pull
          <br> Beige
        </td>
        <td>M</td>
        <td>70,00 €</td>
        <input value="268" type="hidden" name="id" id="id">
        <td class="tab_quantity">
          <select class="form-control select-qty" onchange="this.form.submit();" name="quantity" id="quantity">
            <option value="0">0</option>
            <option value="1">1</option>
            <option selected="selected" value="2">2</option>
          </select>
        </td>

      </tr>
      <tr class="mulitple-item">
        <form class="update-form" action="/clients/orders/46/returnings/144/returning_items" accept-charset="UTF-8" data-remote="true" method="post"></form><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="6QbqIi3DEdg0R6UTTVf1kfnZZ1v5uEvVNu2uh6zJvHhcXb6+KRO2EKeFvdmwyPgf+zoGHdPcivV7SHO6ZgMR9Q==">

        <td><img class="small_image" src="/uploads/product/attachments/1/pull_noir_1.jpg"></td>
        <td>1</td>
        <td>
          Pull
          <br> Noir
        </td>
        <td>S</td>
        <td>30,00 €</td>
        <input value="269" type="hidden" name="id" id="id">
        <td class="tab_quantity">
          <select class="form-control select-qty" onchange="this.form.submit();" name="quantity" id="quantity">
            <option value="0">0</option>
            <option selected="selected" value="1">1</option>
          </select>
        </td>

      </tr>
    </tbody>
  </table>

  <a class="btn btn-main btn-block" href="/clients/orders/46/returnings/144/edit">Continuer le retour</a>
</div>

Answer 1

form_with使用local，而不是remote，默认情况下它设置为false。

您的表单构建正确吗？

编辑：您的表单可以如下重写：

<%= form_with model: @item, method: :patch, class: "update-form" do |f| %>

请粘贴生成的表单（HTML代码）

编辑：如HTML片段所示，并在注释中指出，由于嵌套错误，表单的格式不正确。

远程表单仅在重新加载页面后有效

1 个答案: