Rails7でのf.date_select, f.datetime_selectのオプションやパラメーター（params）の受け渡し方

株式会社TECH LUCKという会社で代表兼エンジニアをしている齊藤です。

DXプロジェクト、開発プロジェクト、Rails開発などでお困りごとがありましたら弊社HPからご相談をいただけますと幸いです。
以下のような問題を解決することができます。

• プロジェクトでRailsエンジニアが足りなくて困っている
• Railsのバージョンアップをしたいがノウハウ・リソースが足りなくて困っている
• オフショア開発をしているが、要件の齟齬やコード品質が悪いので改善したい

また、Railsエンジニアも募集しておりますので、興味がありましたら弊社HPからご連絡いただけますと幸いです。

前提

f.data_selectやf.datetime_selectなどは毎回オプションが多くよく調べていたので、一度まとめてみました。
また、paramsの受け渡しなども参考になるかと思います。

開発環境

• Rails v7.2.1
• TailwindCss
• Ruby v3.3.0

年月日の場合

以下のようなデザインで年月日を入力したい場合に使います。

app/views/posts/new.html.erb

<%== sprintf(f.date_select(:end_date, { use_month_numbers: true, start_year: 2023, end_year: 2030, date_separator: '%s', selected: Date.today }, { required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" }), '年', '月') + '日' %>

このフォームで送られるparameterは以下のようになります。

 #<ActionController::Parameters {"authenticity_token"=>"15AnO3gqF6YkX8WHoiRHiTujrYsLaVRT0soirRYScN_UQpOrbTLcWTbf4kFCn4n4gyb2QtFYicPKVaZkWxSnMA", "post"=>{"content"=>"ga", "end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"14"}, "commit"=>"送信する", "controller"=>"posts", "action"=>"create"} permitted: false>

"end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"14" のようなパラメーターで送られてきますが、ストロングパラメーターで取得すると指定したdatetime型のカラムだと自動的に日時に変換して保存してくれます。

app/controllers/posts_controller.rb

class PostsController < ApplicationController
  def new
    @post = Post.new
  end

  def create
    @post = Post.new(post_params)

    if @post.save
      redirect_to new_post_path
    else
      render :new, status: :unprocessable_entity
    end
  end

  private

  def post_params
    params.require(:post).permit(:content, :end_date)
  end
end

年月の場合

以下のようなデザインで年月を入力したい場合に使います。

app/views/posts/new.html.erb

<%== sprintf(f.date_select(:end_date, { use_month_numbers: true, start_year: 2023, end_year: 2030, discard_day: true, date_separator:'%s', selected: Date.today }, { required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" } ), '年') + '月' %>

これで送られてくるパラメーターは以下のようになります。

#<ActionController::Parameters {"authenticity_token"=>"aoeh_yuC3RiZjQ6eb2LBqTR7bMHpbpx4xEqqDr_hDSdpVRVvPpoW54sNKViP2Q_YjP43CDNfQejc1S7H8ufayA", "post"=>{"content"=>"nono", "end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"1"}, "commit"=>"送信する", "controller"=>"posts", "action"=>"create"} permitted: false>

"end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"14" のようなパラメーターで送られてきますが、ストロングパラメーターで取得すると指定したdatetime型のカラムだと自動的に日時に変換して保存してくれます。

app/controllers/posts_controller.rb

class PostsController < ApplicationController
  def new
    @post = Post.new
  end

  def create
    @post = Post.new(post_params)

    if @post.save
      redirect_to new_post_path
    else
      render :new, status: :unprocessable_entity
    end
  end

  private

  def post_params
    params.require(:post).permit(:content, :end_date)
  end
end

年月日時分の場合

以下のようなデザインで年月日時分を入力したい場合に使います。

app/views/posts/new.html.erb

<%== sprintf(f.datetime_select(:end_date, { use_month_numbers: true, start_year: 2023, end_year: 2030, date_separator: '%s', datetime_separator: '%s', selected: Date.today }, { required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 text-sm focus:ring-blue-500 focus:border-blue-500 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" } ), '年', '月', '日') %>

これで送られてくるパラメーターは以下のようになります。

#<ActionController::Parameters {"authenticity_token"=>"kT5OLrqkwxWKQJ35GcmaSdWs1NlvZ-VuZeFrHbTZo2qS7Pq-r7wI6pjAuj_5clQ4bSmPELVWOP59fu_U-d90hQ", "post"=>{"content"=>"test", "end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"14", "end_date(4i)"=>"03", "end_date(5i)"=>"02"}, "commit"=>"送信する", "controller"=>"posts", "action"=>"create"} permitted: false>

"end_date(1i)"=>"2024", "end_date(2i)"=>"11", "end_date(3i)"=>"14", "end_date(4i)"=>"03", "end_date(5i)"=>"02" のようなパラメーターで送られてきますが、ストロングパラメーターで取得すると指定したdatetime型のカラムだと自動的に年月日日時に変換して保存してくれます。

app/controllers/posts_controller.rb

class PostsController < ApplicationController
  def new
    @post = Post.new
  end

  def create
    @post = Post.new(post_params)

    if @post.save
      redirect_to new_post_path
    else
      render :new, status: :unprocessable_entity
    end
  end

  private

  def post_params
    params.require(:post).permit(:content, :end_date)
  end
end

参考記事