raptor
raptor

Reputation: 117

Bootstrap Switch fires switchChange event but doesn't visually change

I have the following code also in jsfiddle: http://jsfiddle.net/n3pdahtv/

$(document).ready(function(){
    $("#somebox").bootstrapSwitch();

    $("#somebox").bootstrapSwitch().on("switchChange.bootstrapSwitch", function (event, state) {
        alert("Switch pressed");
    });
});

<input type="checkbox" name="somebox" id="somebox" value="40" data-size="mini" data-handle-width="55" data-label-width="30" data-on-text="active" data-off-text="inactive" checked>

The problem is that when you click on the white area inbetween "active" and "inactive" the switch doesn't visually move from one side to the other. The event fires the alert regardless. The switch is taken from this website (http://www.bootstrap-switch.org/) and I have the bootstrap/jquery/bootstrap-switch references in the head section. The examples from that website work when you click on the white area but I have no idea why...

Upvotes: 1

Views: 1087

Answers (1)

ZEE
ZEE

Reputation: 5859

your alert is blocking the animation just remove it and it will work properly :

  $(document).ready(function(){

        $("#somebox").bootstrapSwitch();


    });

Live Demo

Upvotes: 4

Related Questions