Changing a button icon - Mobiscroll jQuery


#1

Hey everyone,

I have an enhanced button with an icon in it. The button has a distinct id so I can easily find it. Currently when the button is clicked I run some processes and then change the background color of the background by removing a class and adding another class.

 <button class='btn-round btn-done btn-inactive' data-icon='checkbox-unchecked' id="ActionDone123">Done</button>

What would be the best way to change this button’s icon?

Right now, if I can’t figure out a better way I would just remove the button and add another in its place, but I"m wondering if i can change an attr using jQuery and then re-run mbsc-enhance() on it?


#2

Hi Michael,

The data-icon attribute is evaluated only when the button is enhanced.
To prevent re-running enhancement to change the icon, you can change the css classes on the icon inside the button, e.g.:

$('#ActionDone123').find('.mbsc-btn-ic').toggleClass('checkbox-unchecked checkbox-checked');