Disable jQueryUI button and keep its original layout/style

Question

If I disable jQueryUI button using "disabled" option, button goes dim. But I don't want it that way - I just want it unresponsive and styled in its original layout - no rollovers, no clicks - everything dead.

Unbinding button click from button doesn't help. Unbinding all events from button using unbind() just as well.

Any ideas?

@Bouillou: if you meant mybuttons.removeClass("ui-button-disabled ui-state-disabled"), this could work but it will leave clicks. And maybe rollovers. I want the button dead, as written in my question. — OzrenTkalcecKrznaric, Oct 24 '12 at 11:18
Still trying to figure out why this was downvoted. I'm surprised this isn't a larger issue. — Sean Beck, Apr 02 '14 at 19:40
@SeanBeck, don't have a faintest idea. But the solution still works for me :) — OzrenTkalcecKrznaric, Apr 03 '14 at 09:17

score 3 · Accepted Answer · answered Oct 24 '12 at 11:10

In fact, you could just remove the "disabled" classes after disabling the button:

$( "button" ).button();

$( "button" ).button('disable');

$( "button" ).removeClass('ui-button-disabled ui-state-disabled')

Here is a fiddle : http://jsfiddle.net/9gq9n/

score 1 · Answer 2 · edited May 23 '17 at 12:14

Ok, at last I figured it out. To disable any jQueryUI button, including 'buttonized' checkbox with label attached (while retaining its original layout), you have to do the following:

unbind its events
unbind events from its label(s)

So, here's an example:

$("mybuttons").unbind();
$("mybuttons").getLabels().unbind();

I'm using a plugin I recently wrote (originally by SO member Gijs, but didn't work always...)

jQuery.fn.getLabels = function () {
    return this.map(function () {
        var parentLabels = $(this).parents('label').get();
        var associatedLabels = this.id ? associatedLabels = $("label[for='" + this.id + "']").get() : [];
        return parentLabels.concat(associatedLabels);
    });
};

Hope it helps.

Disable jQueryUI button and keep its original layout/style

2 Answers2