Question

我正在使用ajax在ruby-on-rails项目中更新产品的搜索结果。在第一次提交表单时，请求不会发送到正确的控制器方法，但自第二次单击以来工作正常。我还是rails和ajax的新手，请帮忙。谢谢！

以下是相关代码：

在视图上：

<form id="search-product">
<div class="container">
  <div class="row">
    <div class="col-md-1">Search by:</div>

    <div class="col-md-1">
      <select name="searchOption">
        <option value="UPC">UPC</option>
        <option value="Vendor_SKU">Vendor SKU</option>
      </select>
    </div>
    <div class="col-md-3">
      <form><input type="text" name="searchValue"></form>
    </div>
    <div class="col-md-2">
    <input type="submit" value="Search" >
    </div>
  </div>
</div>
</form>

控制器上的

：

def search
    search_option = params[:searchOption]
    search_value = params[:searchValue]
    if search_option === 'UPC'
      @product = Product.find_by(upc: search_value) if search_value.length === 12
    elsif search_option === 'Vendor_SKU'
      @product = Product.find_by(vendor_sku: search_value) unless search_value.empty?
    end

    @b_found = false
    @b_found = true if @product
    respond_to do |format|
      format.js
    end
  end

我已将路由配置为将请求定向到控制器操作。

在search.js中：

<% if @b_found %>
  $('#product_search_result').html("<%=escape_javascript render('show', product: @product) %>");
<% else %>
  $('#product_search_result').html("<%=escape_javascript 'No matched product was found!' %>");
<% end %>

在application.js中：

$("#search-product").submit(function(e) {
    e.preventDefault();
    var valuesToSubmit = $(this).serialize();
    $.ajax({
      type: "POST",
      url: "/search_product",
      data: valuesToSubmit,
      dataType: "script",
    });
  })

我尝试过after document.ready但没有什么区别。

Answer 1

我发现这是因为由于turbo-link而没有触发$(document).ready。我能够找到解决方案 Rails 4: how to use $(document).ready() with turbo-links

Ajax请求在第一次表单提交时没有正确响应

1 个答案: