nilatti nilatti - 4 months ago 8
Ajax Question

js.erb not getting triggered

I'm trying to use this tutorial to add new characters to a play model. It's mostly working really well, except that when I click the submit button my form, it does not call my create.js.erb at all. I put an alert('hello') at the top of that file so that I would know if it was called, and it's not.

Other js snippets, like new.js.erb (which renders the form) and destroy.js.erb (which removes a destroyed character from the list of characters) are working correctly.

Here's my code:

View:

#bottom of views/characters/index.html.erb
<div>
<%= link_to "Add Character", new_play_character_path(@play), remote: true %>
</div>
<div id="character-form" style="display:none;"></div>


Form:

<%= bootstrap_form_for([@play, @character], inline_errors: false, remote: true, layout: :horizontal, label_col: "col-sm-2", control_col: "col-sm-10" ) do |f| %>
<%= f.text_field :name %>
<%= f.select :age, ["Baby","Child","Teen","Young Adult","Adult","Senior"] %>
<%= f.select :gender, ["Male","Female","Neutral"] %>
<%= f.submit %>
<% end %>


Controller (relevant bits):

class CharactersController < ApplicationController
before_action :set_character, only: [:show, :edit, :update, :destroy]
before_action :set_play
respond_to :html, :json

def index
@characters = Character.where("play_id = #{@play.id}")

end

def new
@character = Character.new
end

def create
@character = @play.characters.build(character_params)
flash[:notice] = "Character was successfully created." if @character.save
respond_with(@play)
end


create.js.erb

alert('hello');
$('#characters').html("<%= j render(@play.characters) %>");
$('#character-form').slideUp(350);


Lastly, my log:

Started POST "/plays/5/characters" for 127.0.0.1 at 2016-07-06 14:22:03 -0400
Processing by CharactersController#create as JS
Parameters: {"utf8"=>"✓", "character"=>{"name"=>"Romeo", "age"=>"Teen", "gender"=>"Male"}, "commit"=>"Create Character", "play_id"=>"5"}
Play Load (0.1ms) SELECT `plays`.* FROM `plays` INNER JOIN `authors` ON `authors`.`id` = `plays`.`author_id` WHERE `plays`.`id` = 5 ORDER BY authors.last_name LIMIT 1
(0.1ms) BEGIN
SQL (0.2ms) INSERT INTO `characters` (`name`, `age`, `gender`, `play_id`, `created_at`, `updated_at`) VALUES ('Romeo', 'Teen', 'Male', 5, '2016-07-06 18:22:03', '2016-07-06 18:22:03')
(87.1ms) COMMIT
Redirected to http://localhost:3000/plays/5
Completed 302 Found in 94ms (ActiveRecord: 87.5ms)


Started GET "/plays/5" for 127.0.0.1 at 2016-07-06 14:22:03 -0400
Processing by PlaysController#show as JS
Parameters: {"id"=>"5"}
Play Load (0.1ms) SELECT `plays`.* FROM `plays` INNER JOIN `authors` ON `authors`.`id` = `plays`.`author_id` WHERE `plays`.`id` = 5 ORDER BY authors.last_name LIMIT 1
User Load (0.1ms) SELECT `users`.* FROM `users` WHERE `users`.`id` = 2 ORDER BY `users`.`id` ASC LIMIT 1
CACHE (0.0ms) SELECT `plays`.* FROM `plays` INNER JOIN `authors` ON `authors`.`id` = `plays`.`author_id` WHERE `plays`.`id` = 5 ORDER BY authors.last_name LIMIT 1 [["id", "5"]]
Author Load (0.1ms) SELECT `authors`.* FROM `authors` WHERE `authors`.`id` = 4 ORDER BY `authors`.`last_name` ASC LIMIT 1
Act Load (0.1ms) SELECT `acts`.* FROM `acts` WHERE `acts`.`play_id` = 5 ORDER BY `acts`.`act_number` ASC
Character Load (0.4ms) SELECT `characters`.* FROM `characters` WHERE `characters`.`play_id` = 5 ORDER BY name
Rendered characters/_character.html.erb (3.3ms)
Rendered plays/show.html.erb within layouts/application (8.6ms)
Completed 200 OK in 662ms (Views: 654.6ms | ActiveRecord: 0.9ms)

gen gen
Answer

You should add :js format in your controller. Try to change

respond_to :html, :json

to

respond_to :html, :json, :js
Comments