jqueryを使って非同期通信で投稿機能を実装したい【Rails6】

Question

前提・実現したいこと

Rails6にてメッセージの投稿機能を実装中です。
非同期通信を伴わない投稿機能は問題なく実装できています。
今回はform_withのヘルパーメソッドでremote: trueとし、create.js.erbに処理を記述する方法を取っています。しかし、投稿後の非同期処理でエラーが出てしまい、困っています。知恵をお貸しください。

発生している問題・エラーメッセージ

デベロッパーツールのconsoleにて

POST http://localhost:3000/rooms/2/messages 500 (Internal Server Error)

該当のソースコード

app/views/messages/index.html

<div class="wrapper">
  <div class="chat">
    <%= render "main_meeting" %> #部分テンプレートにて投稿一覧と投稿フォームを実装
  </div>
</div>

app/views/messages/_main_meeting

<div class="messages">
  <%= render partial: 'message', collection: @messages %> #投稿一覧
</div>

<%= form_with model: [@room, @message], class: 'form', remote: true do |f| %> #投稿フォーム
  <div class="form-input">
    <%= f.text_field :content, class: 'form-message', placeholder: 'type a message' %>
  </div>
  <%= f.submit '送信', class: 'form-submit' %>
<% end %>

app/views/messages/index.html　※ここの記述が怪しいと考えています

$(".messages").html("<%= j(render partiall: 'message', collection: @messages) %>");

app/controllers/message_controller　※messageはroomとuserに紐づいています

def create
    @rooms = Room.all
    @room = Room.find(params[:room_id])
    @message = @room.messages.new(message_params)
    @messages = Message.all
    if @message.save
    else
      @messages = @room.messages.includes(:user)
      render :index
    end
end

routes.rb

Rails.application.routes.draw do
  devise_for :users
  root to: "rooms#index"
  resources :users, only: [:edit, :update]
  resources :rooms do
    resources :messages, only: [:index, :create]
  end
end

試したこと

①create.js.erbに以下を記述して、処理がされているかを検証

console.log("ok")
console.log("<%= @message.content %>")

結果：問題なく表示された
考察：入力値の保存はできている。また、送信ボタンを押した際、create.js.erbの処理へときちんと移っている。

②エラーを無視して、画面をリロード
結果：入力した内容が投稿されている
考察：やはりcreate.js.erbの
$(".messages").html("<%= j(render partiall: 'message', collection: @messages) %>");
の部分に何か間違いがある。

補足情報（FW/ツールのバージョンなど）

Railsのバージョン…6.0.0
jqueryのバージョン…3.6.0

Answer 1

partial では？

$(".messages").html("<%= j(render partial: 'message', collection: @messages) %>");

Comments

[tekeTECH]

ありがとうございます。自分のタイプミスだったみたいでお恥ずかしい限りではありますが、煮詰まっていたので助かりました。無事実装できたので報告させて頂きます。

[FKM]

Railsの500エラーは8割ぐらいはビューの中に発生するエラーというのが自分の経験です。その中で盲点になるのが、パーシャル部分ですね。

[tekeTECH]

分かりました。500エラーに初めて出くわしたので少し戸惑ってしまい、質問する運びとなりました。今回のことを活かし、また同じようなことが起きた時にはビューファイルの見直しから行いたいと思います。

"Railsの500エラーは8割ぐらいはビューの中に発生するエラーというのが自分の経験です"

こういったアドバイスはとても助かります。本当にありがとうございました。