如何在Rails中的ruby中更新index.html.erb中的数据？

Question

我创建了一个有关产品的应用程序，该应用程序具有name ， price和description 。 在index.html.erb中 ，我想向每个文本框添加文本框，然后单击“编辑”链接可以编辑，不需要进入/ products / id / edit。

如何编辑产品数据？

    <% @products.each do |product| %>
      <tr>
        <form action="/products/<%= product.id %>" class="edit_person_<%= product.id %>" id="edit_person_<%= product.id %>" method="post">
          <input name="_method" type="hidden" value="patch" />
          <input name="authenticity_token" type="hidden" value="NrOp5bsjoLRuK8IW5+dQEYjKGUJDe7TQoZVvq95Wteg=" />
          <td><input id="product_name" name="product[name]" type="text" value="<%= product.name %>" /><br /></td>
          <td><input id="product_price" name="product[price]" type="text" value="<%= product.price %>" /><br /></td>
          <td><input id="product_descr" name="product[descr]" type="text" value="<%= product.descr %>" /><br /></td>
          <td><input name="commit<%= product.id %>" type="submit" value="edit" /></td>
        </form>
      </tr>
    <% end %>

Answer 1

如果要更新数据而不重新加载edit.html.erb文件，则需要使用AJAX。 下面，我将向您展示如何在一个领域中做到这一点，您可以自己承担。

<input id="product_price" name="product[price]" type="text" value="<%= product.price %>" />

在您的js.erb文件中，您可以编写：

$("#product_price").focusout(function() {
    var productPrice = $(this).val();
    $.ajax({
        url: "/products/<%= product.id %>/edit",
        type: "POST",
        data: { product_price: productPrice}, // same way, other attributes
        success: function() {
            console.log("The result successfully came back from ther server.");
            // Now, here you can show a notice to the user that he has successfully update the record without reloading the page.
        }
    });
});