【Rails】Ajax コメント機能にバリデーションエラーメッセージを表示する

  def create
    @product = Product.find(params[:product_id])
    @product_contact = @product.product_contacts.build(product_contact_params)
    respond_to do |format|
      if @product_contact.save
        format.js { render :index }
      else
        format.js { render :error }
      end
    end
  end

$("#contact_messages-error").html("<%= j(render 'layouts/error_messages', model: @product_contact) %>");

    <div id="contact_messages-error">
      <%= render 'layouts/error_messages', model: form.object %>
    </div>

<%= form_with(model: [product, product_contact]) do |form| %>

<!--デフォルトのエラー文 この部分を共通化するため別ファイルに移す-->
<%
=begin %>
    <% if product_contact.errors.any? %>
      <div id="error_explanation">
        <h2><%= pluralize(product_contact.errors.count, "error") %> prohibited this comment from being saved:</h2>
        <ul>
        <% product_contact.errors.full_messages.each do |message| %>
          <li><%= message %></li>
        <% end %>
        </ul>
      </div>
    <% end %>
<%
=end %>
  <div id="contact_messages-error">
    <%= render 'layouts/error_messages', model: form.object %>
  </div>

  <h6 class="message_label">
    <%= form.label t("views.title.contact_message") %>
  </h6>
  <div class="row message_form_area">
    <span class="field message_box">
      <%= form.text_area :contact_message, style: "width:100%", placeholder: "#{@product.name}についてのメッセージ" %>
    </span>

    <span class="actions">
      <button name="button" type="submit" class="btn massage_btn">
      <i class="far fa-paper-plane fa-lg"></i>
      </button>
    </span>
  </div>

<% end %>

<% if model.errors.any? %>
  <div class="alert alert-danger">
    <ul class="list-unstyled">
      <h5><%= model.errors.count %>件のエラー</h5>
      <% model.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
    </ul>
  </div>
<% end %>