Twitter Bootstrap: How to see the state of a toggle button?

Question

How do I see the state of a toggle button?

With a checkbox I can listen to "changed" event of the checkbox and do a $(this).is(":checked") to see what state it has.

<a id="myId" class="btn" data-toggle="button"/>

But not sure how to do that with a toggle button?

Answer 1

you can see what classes the button has..

$(this).hasClass('disabled') // for disabled states
$(this).hasClass('active') // for active states
$(this).is(':disabled') // for disabled buttons only

the is(':disabled') works for buttons, but not the link btns

Answer 2

If you're using jQuery to intercept the click event like so...

$(this).click(callback)

you need to get creative because .hasClass('active') doesn't report the correct value. In the callback function put the following:

$(this).toggleClass('checked')
$(this).hasClass('checked')