バリデーション時のエラーメッセージを入力フォーム直下に表示する

Question

いつもお世話になります。
現在いくつかの入力フォームと保存ボタンを用意し押されたときにバリデーションを用いて画面上部に空欄エラーを表示しています。

このメッセージの表示をフォームの下に出したいと考えているのですが、調べてもほとんど出てこずこちらで質問させていただきました。

アプローチの仕方、参考になるサイトなどでも構いませんのでご教示いただけますと幸いです。

よろしくお願いいたします。

# xxxx.html.erb

<% if @user.errors.any? %>
  <div id="error_explanation" class="alert alert-danger">
    <ul>
      <% @user.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
    </ul>
  </div>
<% end %>

<%= form_with(model: @userinfo, local: true, html: {id: 'inform_save', class: 'form', autocomplete: 'off'}) do |f| %>
  <div class="field">
    <%= f.label :to %>
    <%= f.text_field :to, size: 25, value: @userenter.email_to, id: "email_to" %>
  </div>

・
・ 省略
・
<div class="actions">
    <%= f.submit '保存' %>
  </div>
<% end %>



# /app/models/yyyy.rb

validate :user_error

  def user_error

    if email_to.blank?
      errors[:base] << "Toは必ず入力してください"
    end
  end

Answer 1

<% if @user.errors.any? %>
  <div id="error_explanation" class="alert alert-danger">
    <ul>
      <% @user.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
    </ul>
  </div>
<% end %>

こちらがエラーメッセージ表示部分かと思いますので、

<div class="actions">
    <%= f.submit '保存' %>
  </div>
<% end %>

これの上あたりに移動させてはいかがですか？