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
Post a Comment