Rails / jQuery – フォームに複数の値を配列でセットする

やりたいこと

  • イベントトリガで検索フォーム(ransack)に複数の値を配列でセットしたい。

問題点

jQueryでセットした配列が、コントローラで文字列配列となってしまう(以下参照)。

パターン①

html.slim


= f.hidden_field :status_id_in, mutiple: true

js.slim


var var_1 = 1;
var var_2 = 2;
$('#q_status_id_in').val(["#{var_1}", "#{var_2}"]);

Controller


params[:q][:status_id_in] => ["1,2"]
# 文字列となり、このままではransackのparamsにできない。

パターン②

jsコードを以下のようにしてもダメ。

js.slim


$('#q_status_id_in').val("#{[var_1, var_2]}");

Controller


params[:q][:status_id_in] => ["[1,2]"]
# これも文字列となりだめ。

解決策

渡したい値の数だけhidden_field増やし、個々に値をセットする。

html.slim


= f.hidden_field :status_id_in, mutiple: true, class: "js-input-1"
= f.hidden_field :status_id_in, mutiple: true, class: "js-input-2"

js.slim


var var_1 = 1;
var var_2 = 2;
$('.js-input-1').val("#{var_1}");
$('.js-input-2').val("#{var_2}");

Controller


params[:q][:status_id_in] => ["1","2"]

Yay!

Sources

兵庫県西宮市生まれのフリーランスRailsエンジニア。海外を拠点にデジタルノマド生活中。/ 前職・資格:公認会計士 / プログラミング言語:Ruby, JavaScript, HTML, CSS / 日本語・英語
コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です