Rails5 form_withの非同期通信にて、送信ボタンを押しても送信できない

Ruby on Rails初学者です。

助けていただきたことがあり、投稿させていただきました。

製作物を作っている途中に発生したことなのですが、DM機能を実装し、非同期で送信できるようにしました。

しかし、Enterボタンを押すと非同期で送信はできるのですが、Submitボタンを押しても送信できず、エラーログは無し。

更新ボタンを押してリロード後は、ボタンを押しても問題なく動きます。

エラーログで出ないため、如何にもこうにも不明な状態です。どうかご教授願います。

以下に各コードを記載いたします。

ーーー room Cotroller ーーー
def show
  @room = Room.find(params[:id])
  if Entry.where(user_id: current_user.id, room_id: @room.id).present?
    @messages = @room.messages
    @message = Message.new
    @entry = @room.entries
  else
    redirect_back(fallback_location: root_path)
  end
end

ーーー message Cotroller ーーー
def create
    if Entry.where(user_id: current_user.id, room_id: params[:message][:room_id]).present?
      @message = Message.create(params.require(:message).permit(:user_id, :room_id,
                                                                :content).merge(user_id: current_user.id))
      @room = @message.room

      @othermember = Entry.where(room_id: @room.id).where.not(user_id: current_user.id)
      @theid = @othermember.find_by(room_id: @room.id)
      notification = current_user.active_notifications.new(
        room_id: @room.id,
        message_id: @message.id,
        visited_id: @theid.user_id,
        visitor_id: current_user.id,
        action: 'dm'
      )
      notification.checked = true if notification.visitor_id == notification.visited_id
      notification.save if notification.valid?

    else
      redirect_back(fallback_location: root_path)
    end
  end

ーーー room Controller showアクションのView ーーー
<div class="container all">
  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">

      <div class="row mb-5">
        <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 offset-xs-2 offset-sm-2 offset-md-2 offset-lg-2">
          <div class="new_message">
            <%= link_to rooms_path, class: "btn back-btn" do %><strong><i class="fas fa-chevron-left"></i></strong><% end %>
            <% @entry.includes(:user).each do |e| %>
              <% unless e.user == current_user %>
                <%= attachment_image_tag e.user, :profile_image, size: "70x70", class: "rounded-circle" %>
                <strong><span class="message_my_name"><%= e.user.name %></span></strong>
              <% end %>
            <% end %>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 offset-xs-2 offset-sm-2 offset-md-2 offset-lg-2">
          <div class="message">
            <% @messages.each do |message| %>
              <% if message.user_id == current_user.id %>
                <div class="mycomment mt-1 mb-1">
                  <p class="my-dm ml-auto"><%= message.content %></p>
                </div>
              <% else %>
                <p class="other-dm"><%= message.content %></p>
              <% end %>
            <% end %>
          </div>
        </div>
      </div>

      <div class="row mt-3">
        <div class="col"></div>
        <div class="col-xs-7 col-sm-7 col-md-7 col-lg-7 offset-xs-1 offset-sm-1 offset-md-1 offset-lg-1">
          <div class="new_message form-group">
          <%= form_with model: @message, url: messages_path, method: :post do |f| %>
            <%= f.text_field :content, class: "form-control", id: "new_message" %>
            <%= f.hidden_field :room_id, value: @room.id %>
          </div>
        </div>
          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
            <%= f.submit '送信', class: 'btn message-btn text-dark' %>
          </div>
           <% end %>
           <div class="col"></div>
      </div>
    </div>
  </div>
</div>

ーーー　メッセージ送信時のJSファイル　ーーー
$('.message').append("<div class='mycomment mt-1 mb-1'><p class='ml-auto' style='position: relative; background: #32cd54; border: 1px solid #777; margin: 10px; padding: 10px; border-radius: 15px; margin-left: 20%; clear: both; max-width: 500px; float: right;'><%= @message.content %></p></div>");
document.getElementById("new_message").value = "";