將 javascript 選擇變量傳遞給 rails 控制器

Question

我正在開發一個 Rails (v.5.2.3) 應用程序，該應用程序應該為基於 (1) 不同變量和 (2) 地圖上的套索選擇的空間數據（模型“測量”）提供數據過濾能力。 這兩個過濾器選項都應該在同一視圖（“歡迎/索引”）中可用。

用於准備和過濾數據的控制器的相關部分：

# app/controllers/welcome_controller.rb
def index

    @selected_measurements = Measurement.where(
        "measurements_id IN (?) OR name = ?",
        params[:spatial_lasso_selection],      
        params[:query_site_name]
    ).all

    gon.selected_measurements = @selected_measurements.to_json
end 

在視圖中，我使用 form_tag 作為過濾器變量定義 (1)：

# app/views/welcome/index.html.erb
<%= form_tag({controller: "welcome", action: "index"}, method: "get") do %>
    <%= label_tag(:query_site_name, "Site name:") %>
    <%= text_field_tag(:query_site_name, (params[:query_site_name] or "")) %>
    <%= submit_tag("Search") %>
<% end %>

在資產目錄中，我有一個 javascript 文件，它構建傳單地圖（通過傳單導軌），將點數據添加為標記，並啟用傳單套索插件以在地圖上進行 (2) 套索選擇。 此代碼嵌入在歡迎視圖中以在那里顯示地圖。

套索選擇給了我一個measurement_ids的javascript數組。 我想將此數組發送到我的 rails 控制器以過濾數據並更新視圖（ params[:spatial_lasso_selection] ）。 我了解到我應該使用 ajax 請求來執行此操作，但是我在實現它時遇到了困難。 我不明白如何將 form_tag 和原始 javascript 一起使用來使 (1) 和 (2) 無縫工作。

我認為 ajax 調用必須如下所示：

$.ajax({
    type: "get",
    url: '/welcome/index',
    data: { spatial_lasso_selection: JSON.stringify(lasso_selected_measurements) },
});

Answer 1

我也有 ajax 請求的問題。 相反，我使用輸入文本值屬性將我的 javascript 變量傳遞給控制器​​。 首先，只需使用在index.html中具有特定 id 的隱藏輸入屬性制作簡單的表單。 下一個創建按鈕，將變量發送到

<form id "myForm" action="/welcome/index">
  <input type="hidden" id="myVar" name="varParams">
</form>
<button id="btnSend">SEND</button>

然后，創建 javascript 函數以在單擊按鈕時使用我們所需的變量設置輸入文本的值。 只需將下面的代碼放在您的index.html 。

<script>
document.getElementById('btnSend').addEventListener('click', function () {
  document.getElementById("myVar").value = "myValue";
  document.getElementById("myForm").submit();
});
</script>

接下來，只需在您的welcome_controller.rb檢索myVar 參數。

  def index
    myVar = params[:varParams]
    # Do something with myVar variable  
  end