ActionController::UnknownFormat error after installing Bootstrap to my project

Question

Everything was fine before adding Bootstrap to the project. Now I am getting ActionController::UnknownFormat error. I was using jquery in my project before(added with yarn). But when installing Bootstrap, I also installed jquery for it with a gem. Maybe there can be a problem in there. Thanks for helping.

comments_controller.rb

def create
    @book = Book.find(params[:book_id])
    @comment = @book.comments.create(comment_params)
    respond_to :js
end

create.js.erb

$(".comment").append("<%= escape_javascript(render(@comment))%>");

_comment.html.erb

<p><strong><%= comment.title %></strong> | <%= comment.commenter %></p>
<p><%= comment.content %></p>

Console output

app/controllers/comments_controller.rb:17:in `create'
Started POST "/books/2/comments" for 127.0.0.1 at 2020-10-30 14:45:28 +0300
Processing by CommentsController#create as HTML
  Parameters: {"authenticity_token"=>"PT6Go3HJURAbU7olooyAVa7j5Xna9NlfulH62DPt/JbcfRXw1cWEujnfNhhjmafyncB9tMkefUKT09z+d0ryiQ==", "comment"=>{"title"=>"a", "content"=>"s", "commenter"=>"user", "approved"=>"false"}, "commit"=>"Create Comment", "book_id"=>"2"}
  User Load (0.2ms)  SELECT "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 1], ["LIMIT", 1]]
  Book Load (0.2ms)  SELECT "books".* FROM "books" WHERE "books"."id" = $1 LIMIT $2  [["id", 2], ["LIMIT", 1]]
  ↳ app/controllers/comments_controller.rb:15:in `create'
   (0.1ms)  BEGIN
  ↳ app/controllers/comments_controller.rb:16:in `create'
  Comment Create (0.4ms)  INSERT INTO "comments" ("title", "content", "approved", "book_id", "created_at", "updated_at", "commenter") VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING "id"  [["title", "a"], ["content", "s"], ["approved", false], ["book_id", 2], ["created_at", "2020-10-30 11:45:28.088322"], ["updated_at", "2020-10-30 11:45:28.088322"], ["commenter", "utkucb"]]
  ↳ app/controllers/comments_controller.rb:16:in `create'
   (0.8ms)  COMMIT
  ↳ app/controllers/comments_controller.rb:16:in `create'
Completed 406 Not Acceptable in 9ms (ActiveRecord: 1.8ms | Allocations: 5589)


  
ActionController::UnknownFormat (ActionController::UnknownFormat):
  
app/controllers/comments_controller.rb:17:in `create'

I'm accessing CommentsController#create in books/show.html.erb with this form.

<%= form_with(model: [ @book, @book.comments.build ], local: false) do |form| %>
  <p>
    <%= form.label :title %><br>
    <%= form.text_field :title %>
  </p>
  <p>
    <%= form.label :content %><br>
    <%= form.text_area :content %>
  </p>
  <%= form.hidden_field :commenter, value: current_user.username %>
  <%= form.hidden_field :approved, value: false %>
  <p>
    <%= form.submit %>
  </p>
<% end %>

My Rails version is Rails 6.0.3.4 and Bootstrap version is 5.0.0.alpha1. I used this tutorial to use jquery and everything was fine. Than used this to add Bootstrap.

`Processing by CommentsController#create as HTML` -- What's changed to make this an HTML request, not a JS request? — Tom Lord, Oct 30 '20 at 13:17
can you provide the code, how are you accessing this `CommentsController#create` ? I think format option is just missing, thus generating wrong url — zhisme, Oct 30 '20 at 13:33
@TomLord I couldn't find it but when I try to logout i get `No route matches [GET] "/users/sign_out"` error too. It's likely about jquery. I've seen some solutions to add `require jquery` to _application.js_. But it didn't solved problem. — Ulaş Kılıçaslan, Oct 30 '20 at 14:05

Palash Bera · Answer 1 · 2020-10-30T14:32:05.530

0

you can try this.

# app/views/books/show.html.erb

<%= form_with [@book, @book.comments.build], remote: true do |form| %>
  <p>
    <%= form.label :title %><br>
    <%= form.text_field :title %>
  </p>
  <p>
    <%= form.label :content %><br>
    <%= form.text_area :content %>
  </p>
  <%= form.hidden_field :commenter, value: current_user.username %>
  <%= form.hidden_field :approved, value: false %>
  <p>
    <%= form.submit %>
  </p>
<% end %>

edited Oct 30 '20 at 14:32

answered Oct 30 '20 at 14:24

Palash Bera

696
5
12

1

It didn't work. `form_with` use the `local` option and no longer use `remote` option as I know. – Ulaş Kılıçaslan Oct 30 '20 at 14:29
I did a mistake. I updated my answer. Now I think it will work. :) – Palash Bera Oct 30 '20 at 14:32

score 0 · Answer 2 · answered Oct 30 '20 at 14:35

0

form_with method accepts bunch of options. Rails in order to understand which route you want to access, you should specify explicitly :format or :url For others refer to the documentation

just change form_with to this

<%= form_with(model: [ @book, @book.comments.build ], format: :js) do |form| %>

or

<%= form_with(model: [ @book, @book.comments.build ], url: comments_path) do |form| %>

answered Oct 30 '20 at 14:35

zhisme

2,368
2
19
28

Thanks for response and your help. But as I said in the question, I was using jquery smoothly before I added bootstrap to the project. Everything was fine. Probably something I add preventing it from working properly. I'm getting `No route matches [GET] "/users` error too when i try to log out. – Ulaş Kılıçaslan Oct 30 '20 at 14:52
please update question with rails, ruby, version and instructions how you added bootstrap, and which version of bootstrap. maybe there is known bug or I can help with investigation – zhisme Oct 30 '20 at 15:20

score 0 · Accepted Answer · answered Oct 30 '20 at 17:42

I tried to debug in browser and saw 'Uncaught ReferenceError: $ is not defined' error. Changed to code below config/webpack/environment.js and deleted require('packs/jquery') in application.js.

Used the solution in this answer.

const { environment } = require('@rails/webpacker')
    
const webpack = require('webpack')
environment.plugins.prepend('Provide', new webpack.ProvidePlugin({
  $: 'jquery/src/jquery',
  jQuery: 'jquery/src/jquery',
  jquery: 'jquery',
  'window.jQuery': 'jquery',
  Popper: ['popper.js', 'default']
}))
    
module.exports = environment

ActionController::UnknownFormat error after installing Bootstrap to my project

3 Answers3