為什么這個Rails表單不會通過JavaScript提交？

Question

我試圖通過JavaScript提交一個基本的Rails表單，但它只是不工作...我不知道為什么。 我已將remote設置為true並檢查是否已加載所有適當的文件。 有人可以幫忙嗎？

這是我的表單代碼..我正在使用Ransack search_form_for幫助器，但我不認為這應該有任何影響。

<%= search_form_for @q, url: (form_url), id: 'my-form', remote: true, html: {method: :get, :class => 'filter-form'} do |f| %>

這是我的jQuery：

products.js.coffee    
jQuery ->
        $('#my-form').submit();

我錯過了一些非常明顯的東西嗎？

這是它呈現的表單標記：

<form accept-charset="UTF-8" action="/products" class="filter-form" data-remote="true" id="my-form" method="get">

這是我點擊提交時的服務器日志：

Started GET "/products?utf8=%E2%9C%93&q%5Bupward_trending%5D=true&q%5Bdownward_trending%5D=&q%5Bseven_days%5D=&q%5Bthirty_days%5D=&q%5Bsix_months%5D=&q%5Btwelve_months%5D=&q%5Ball_time%5D=&q%5Bname_cont%5D=test&q%5Bcategory_id_i
n%5D%5B%5D=1&q%5Bcategory_id_in%5D%5B%5D=3&q%5Bcategory_id_in%5D%5B%5D=4&q%5Bcategory_id_in%5D%5B%5D=6&q%5Bcategory_id_in%5D%5B%5D=7&q%5Bcategory_id_in%5D%5B%5D=8&q%5Bcategory_id_in%5D%5B%5D=9&q%5Bcategory_id_in%5D%5B%5D=10&q%5B
category_id_in%5D%5B%5D=11&q%5Bcategory_id_in%5D%5B%5D=12&q%5Bcategory_id_in%5D%5B%5D=14&q%5Bcategory_id_in%5D%5B%5D=15&q%5Bcategory_id_in%5D%5B%5D=&q%5Bcountry_eq%5D=&q%5Bprice_gbp_gteq%5D=&q%5Bprice_gbp_lteq%5D=&q%5Bstart_date
_gteq%5D=&q%5Bstart_date_lteq%5D=&commit=Filter" for 187.153.50.8 at 2015-02-25 17:41:47 +0000                                                                                                                                      
Processing by ProductsController#index as JS                                                                                                                                                                                        
  Parameters: {"utf8"=>"✓", "q"=>{"upward_trending"=>"true", "downward_trending"=>"", "seven_days"=>"", "thirty_days"=>"", "six_months"=>"", "twelve_months"=>"", "all_time"=>"", "name_cont"=>"test", "category_id_in"=>["1", "3", 
"4", "6", "7", "8", "9", "10", "11", "12", "14", "15", ""], "country_eq"=>"", "price_gbp_gteq"=>"", "price_gbp_lteq"=>"", "start_date_gteq"=>"", "start_date_lteq"=>""}, "commit"=>"Filter"}                                        
  User Load (0.4ms)  SELECT  "users".* FROM "users"  WHERE "users"."id" = 1  ORDER BY "users"."id" ASC LIMIT 1                                                                                                                      
  Category Load (0.3ms)  SELECT "categories".* FROM "categories"                                                                                                                                                                    
  Rendered products/_filter.html.erb (370.0ms)                                                                                                                                                                                      
  Product Load (22.8ms)  SELECT  "products".* FROM "products"  WHERE (status > 100) AND "products"."above_revenue_average" = 't' AND (("products"."name" ILIKE '%test%' AND "products"."category_id" IN (1, 3, 4, 6, 7, 8, 9, 10, 11
, 12, 14, 15)))  ORDER BY "products"."end_date" DESC LIMIT 30 OFFSET 0                                                                                                                                                              
  Category Load (0.2ms)  SELECT  "categories".* FROM "categories"  WHERE "categories"."id" = $1 LIMIT 1  [["id", 3]]                                                                                                                
  Category Load (0.2ms)  SELECT  "categories".* FROM "categories"  WHERE "categories"."id" = $1 LIMIT 1  [["id", 11]]                                                                                                               
  Category Load (0.2ms)  SELECT  "categories".* FROM "categories"  WHERE "categories"."id" = $1 LIMIT 1  [["id", 9]]                                                                                                                
  CACHE (0.0ms)  SELECT  "categories".* FROM "categories"  WHERE "categories"."id" = $1 LIMIT 1  [["id", 9]]                                                                                                                        
  Category Load (0.2ms)  SELECT  "categories".* FROM "categories"  WHERE "categories"."id" = $1 LIMIT 1  [["id", 4]]                                                                                                                
   (43.6ms)  SELECT COUNT(*) FROM "products"  WHERE (status > 100) AND "products"."above_revenue_average" = 't' AND (("products"."name" ILIKE '%test%' AND "products"."category_id" IN (1, 3, 4, 6, 7, 8, 9, 10, 11, 12, 14, 15)))  
  Rendered products/index.html.erb within layouts/application (483.3ms)                                                                                                                                                             
  Rendered layouts/_header.html.erb (2.1ms)                                                                                                                                                                                         
  Rendered layouts/_footer.html.erb (0.5ms)                                                                                                                                                                                         
Completed 200 OK in 593ms (Views: 384.2ms | ActiveRecord: 187.1ms)

Answer 1

當您將表單設置為遠程時：在Rails中為true，它為您AJAX化表單。 這意味着而不是您的瀏覽器提交AJAX表單。 默認情況下，在Rails中，此AJAX請求將請求將Javascript文件發送回瀏覽器。 這意味着您的index.html.erb文件不會被發送回瀏覽器。 相反，收到的是您的products.js.coffee.erb文件：

jQuery ->
    $('#my-form').submit();

響應中沒有其他數據。 它沒有搜索結果。 要解決這個問題，我們可以在這個文件中使用erb來渲染你想要的數據，如下所示：

$("<%= j (render '@q') %>").appendTo("my-form");