How to set jQuery UI toggle programmatically?

Question

I noticed it is possible to set the value of a jQuery UI slider in the following way:

$("#mySlider").slider("value", 42);

This triggers the event handlers attached to the slider as expected.

Now I'm trying to do the same trick using a button (toggle). There does not appear to be a nice way to do this in the API. I might just be missing something simple.

I tried the following with no results:

$("#myButton").button().click();

Any ideas how to handle that in this case are welcome. Note that it would be awesome to find a solution that applies for a buttonset as well.

Edit

Note that I need this particular functionality to simulate the user. Here's some code to illustrate the issue better:

function toggleBrushValue(hotkey, attributeName) {
    shortcut.add(hotkey, function(e) {
        //XXX: the missing part
        $("#" + attributeName).<something?>;
    });
}

function increaseBrushValue(hotkey, attributeName) {
    shortcut.add(hotkey, function(e) {
        var currentSize = $("#" + attributeName).slider("value");

        $("#" + attributeName).slider("value", currentSize + 1);
    });
}

Answer 1

Try using .toggle(), like the following:

$("#myButton").toggle(
    function() {
        $("#mySlider").slider("value", 42);
    },
    function() {
        // something else...
    }
);

It will work on a button-set too since you provide the correct selector. For example:

<input id="myButton" ...>
<input id="myButton" ...>
<input id="myButton" ...>

$('#myButton').toggle() will be executed for each of the above elements. Additionally, If you need to interact with the button from within the function itself, use this or $(this). For example:

$("#myButton").toggle(
    function() {
        alert($(this).attr('id'));
    },
    function() {
        alert($(this).attr('name'));
    }
);

Answer 2

It took a while but finally I found a way around the issue. :) Here's my solution:

var $toggle = $("#" + attributeName);

$toggle.attr("checked", !$toggle.attr("checked")).button("refresh");

As jQuery UI toggles get their initial value via "checked", I decided to use that to my advantage. "refresh" makes sure its visual state gets updated as well.