remote:true - 提交按钮有效但 this.form.submit 无效

Question

我有 form_with 表格，我想通过 Ajax remote:true 请求发送数据。

什么有效： - 当我点击提交按钮时，一切正常，我收到一个警告框（这是我放在我的 .js.erb 文件中的内容）

什么不起作用： - 我有很多字段的搜索表单，我想在任何字段更改时提交表单。没有 ajax 它工作正常，代码 "onchange="this.form.submit();" 完美工作。但是当我使用 Ajax 时，this.form.submit() 仍在重新加载页面。

预期结果： - 当我更改任何字段时，它会在不重新加载页面的情况下发送数据。如果可能的话，我想避免使用常规 Ajax 并使用 remote:true form_with 方法。

我试过的 - 我使用了很多 jquery 变体 f.e.:

this.form.submit();
$('#id_of_submit_button').click(); // it works but i want to make it without using submit button
$(this).closest("form").submit();

我的代码：

show.html.erb

<%= form_with(url: "/cars/" + @car.id.to_s + "#formcarsection", id: "filterform", remote: true, method: "get") do |f| %>
  <%= f.text_field :vin, onchange: "this.form.submit();", class: "form-control" %>
  <input type="submit" id="submitbtn" value="Count" class="car__submit-btn">
<%= end %>

cars_controller.html.erb

def show
  respond_to do |format|
    format.html
    format.js { render 'cars/show.js.erb' }
  end
end

cars/show.js.erb

alert("Hello! I am an alert box!!");

Answer 1

每个字段都需要添加remote: true。

<%= f.text_field :vin, data: { url: "/cars/" + @car.id.to_s + "#formcarsection", remote: true, class: "form-control" } %>

remote:true - 提交按钮有效但 this.form.submit 无效

remote:true - submit button works but this.form.submit not

ruby-on-rails-6