LoginSignup
10
8

More than 3 years have passed since last update.

フォームをGETで送信するときは送信したいパラメータをURLではなくhiddenタグに設定する必要がある、という話

Last updated at Posted at 2020-05-20

はじめに:イントロダクション

以下のような単純なRailsのフォームがあったとします。

<%= form_tag foo_blogs_path(some_flag: 1) do %>
  <%= button_tag 'Foo' %>
<% end %>

コントローラのコードは次のようにsome_flagの値をnoticeに出力するようになっています。

class BlogsController < ApplicationController
  def foo
    redirect_to :blogs, notice: "Foo / some_flag: #{params[:some_flag]}"
  end
end

以下はFooボタンをクリックしたときの実行結果です。
フォームのURLに設定したsome_flag: 1の値が表示されています。

Screen Shot 2020-05-20 at 9.27.10.png

本題:困ったこと

上の例と同じようなことを以下のようなフォームでもやろうとしました。

<%= form_tag bar_blogs_path(some_flag: 1), method: :get do %>
  <%= button_tag 'Bar' %>
<% end %>

先ほどのコード例と違うのはフォームのHTTPメソッドがGETになっている点(method: :get)です。

コントローラ側のコードはほぼ同じです。

class BlogsController < ApplicationController
  def bar
    redirect_to :blogs, notice: "Bar / some_flag: #{params[:some_flag]}"
  end
end

しかし、Barボタンをクリックしてみると・・・

Screen Shot 2020-05-20 at 9.27.30.png

あれっ、some_flagの値が空になってる!

ログを見るとこんなふうになっていてsome_flagの値が渡されていません。

Started GET "/blogs/bar?button=" for 127.0.0.1 at 2020-05-20 09:13:49 +0900

出力されたHTMLを見てみると、action="/blogs/bar?some_flag=1"のようにsome_flagの値がちゃんと設定されているように見えます。

<form action="/blogs/bar?some_flag=1" accept-charset="UTF-8" method="get">
  <button name="button" type="submit">Bar</button>
</form>

なんでだろう、おかしいなあ・・・。
原因を突き止めるためにいろいろ試行錯誤したものの、some_flagの値をサーバーに送信することができず、この日は諦めて寝ることにしました。

翌日・・・解決しました!

次の日、デバッグを再開したところ、今度は原因と解決策がわかりました。
フォームをGETで送信する場合は、actionのURLではなくhiddenタグに送信したいパラメータを含める必要があるのでした。

<%= form_tag bar_blogs_path, method: :get do %>
  <!-- hiddenタグに送信したいパラメータを含める -->
  <%= hidden_field_tag :some_flag, 1 %>
  <%= button_tag 'Bar' %>
<% end %>

こうすればsome_flagの値をサーバーに送信することができます!

Screen Shot 2020-05-20 at 9.27.45.png

ログを見てもsome_flag=1が送信されていることがわかります。

Started GET "/blogs/bar?some_flag=1&button=" for 127.0.0.1 at 2020-05-20 09:22:21 +0900

これで解決です。めでたしめでたし。

10
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
8