Jquery & Ruby - Toggle function not working

Question

Could one kindly advise me why my javascript code is not working

i am using the gem simple_form, what i am trying to do is:

when a user clicks on the red box (as displayed in the image) the empty red box image should change to a tick box
i have 2 css images; img-checkbox-notick.png (none tick box image) & img-checkbox-tick.png (tick box image)

i am using javascript / toggle

new.html.erb

<div class="checkbox custom">
    <%= f.input :remember_me, input_html: { class: 'css-checkbox' }, label_html: { class: 'css-label-notick' }, as: :boolean if devise_mapping.rememberable? %>
 </div>

javascript file

$(document).ready(function() {
  $('.css-label-notick').on('click', function (e) {
      $('.css-label-notick').toggleClass(".css-label-tick");
  });
});

i have displayed the details of the input within the image highlighted in red

css file

.css-label-notick {
  background: url("img-checkbox-notick.png") no-repeat;
  height: 65px;
}

.css-label-tick {
  background: url("img-checkbox-tick.png") no-repeat;
  height: 65px;
}

any advise would be much appreciated - many thanks

DinoMyte · Accepted Answer · 2015-08-31 22:55:25Z

2

While using toggleClass method, you don't need to put period(.) in front of the classname.

 $(document).ready(function () {
        $('.css-label-notick').on('click', function (e) {
            $(this).toggleClass("css-label-tick");
        });
    });

Working example : http://jsfiddle.net/xno5hb34/3/

answered Aug 31, 2015 at 22:55

DinoMyte

8,8781 gold badge21 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Jquery & Ruby - Toggle function not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related