javascript - Update view background in post action Rails -


i'm trying update elements background image when controller action called , haven't been able figure out. in view have following tag

<%= link_to '', color_animal_path(@article), method: :post, :id => "animal-image", remote: true %> 

when it's clicked calls method below in animalscontroller.rb

  def color     respond_to |format|       format.js {}     end     puts 'color called'   end 

i have js file called color.js following contents in app/assets/javascripts

$('#animal-image').css('background-image', 'url("green.jpg")'); 

and css element looks this

#animal-image {   float: left;   width: 28px;   height: 28px;   background: grey;   background: url('red.png') no-repeat;   background-size: contain; } 

the view renders correctly red image, , clicking on image calls controller (i can see puts output) element background image isn't updating...i'm hoping can help, on right track, missing something?

thanks

is there particular reason ujs call @ all? why not in client-side jquery?

even if there reason (e.g. colour needs dynamically set server, or want track event), i'd suggest testing in isolation on client side until working - reintegrate rails ujs component.

for example, start adding new css class green image:

#animal-image.updated {   background-image: url('green.png'); } 

then add js:

$( "#animal-image" ).click(function() {   $(this).toggleclass('updated'); }); 

if works, can put color.js , verify in browser's dev tools response coming correctly , it's being evaluated.


Comments