Zenn
🦧

バリデーションのエラーメッセージをフォームごとに見やすく表示する方法

2021/04/23に公開
Rails
Ruby
Tips
tech

はじめに


rails tutoroalなどではバリデーションチェックによるエラーメッセージは上のようにまとめて表示していますが、フォームごとの方が見やすいのでapplication helperを使って実装したいと思います。
なお、エラーメッセージやカラム名は日本語化可能な状態にしていますが方法については色々な記事があるので今回は触れておりません。（参考に記載）

helperメソッド

# application_helper
module ApplicationHelper
  def errors_hash(resource)
    resource.errors.messages.map do |col, errors_array|
      [col, errors_array.map { |error| resource.class.human_attribute_name(col) + error }]
    end.to_h
  end
end

まずresouceにバリデーションチェックを行ったモデルのインスタンスが入り、

resource.errors.messages
=>{:name=>["を入力してください"]}

のようなデータが変えるので日本語化を行い最終的に
{:name=>["名前を入力してください"]}
こんな感じのデータを返すようにします

フォームに追加

postでバリデーションを行うフォームに追加します。

# 途中は省略
     <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
    .
    .
    .
    <%= f.label :username %>
    <%= f.text_field :username, autofocus: true %>

    # エラーメッセージの表示
    <% errors_hash(resource)[:username].each do |error_msg| %>
    <p class="text-xs text-red-500"><%= error_msg %></p>
    <% end %>
    .
    .
    .
    <%= f.submit "新規登録する" %>
    <% end %>

完成

無事表示されました

終わりに

見やすくなった反面、フォームごとに追加しなくてはならないのが面倒です。
もし他に方法があれば是非コメントください！

参考

rails 国際化API

Discussion