jQuery Mobile how to check if button is disabled?

JavascriptJqueryJquery UiJquery Mobile

Javascript Problem Overview


I disable the button like this on my jQuery Mobile webpage:

$(document).ready(function() {
    $("#deliveryNext").button();
    $("#deliveryNext").button('disable');
});

and i can enable it with

$("#deliveryNext").button('enable');

But how do i check if the button is disabled or enabled?

This command gives "undefined":

$("#deliveryNext").attr('disabled')

Some ideas?

Edit: i find out that $("#deliveryNext").button('disable') only seams to change the style on the button, the clicking works fine after so i need to disable the button some how also.. i tried .attr('disabled', 'disabled') but when i then test .attr('disabled') i get undefined...

Edit2: more about my "real" problem at https://stackoverflow.com/questions/6438659/how-to-disable-a-link-button-in-jquery-mobile

Javascript Solutions


Solution 1 - Javascript

try :is selector

$("#deliveryNext").is(":disabled")

Solution 2 - Javascript

Use .prop instead:

$('#deliveryNext').prop('disabled')

Solution 3 - Javascript

Faced with the same issue when trying to check if a button is disabled. I've tried a variety of approaches, such as btn.disabled, .is(':disabled'), .attr('disabled'), .prop('disabled'). But no one works for me.

Some, for example .disabled or .is(':disabled') returned undefined and other like .attr('disabled') returned the wrong result - false when the button was actually disabled.

But only one technique works for me: .is('[disabled]') (with square brackets).

So to determine if a button is disabled try this:

$("#myButton").is('[disabled]');

Solution 4 - Javascript

Try

$("#deliveryNext").is(":disabled")

The following code works for me:

<script type="text/javascript">
    $(document).ready(function () {
        $("#testButton").button();
        $("#testButton").button('disable');
        alert($('#testButton').is(':disabled'));
    });
</script>
<p>
    <button id="testButton">Testing</button>
</p>

Solution 5 - Javascript

I had the same problem and I found this is working:

if ($("#deliveryNext").attr('disabled')) {
  // do sth if disabled
} else {
  // do sth if enabled 
}

If this gives you undefined then you can use if condition also.

When you evaluate undefined it will return false.

Solution 6 - Javascript

Try

$("#deliveryNext").is('[disabled]');

Solution 7 - Javascript

http://jsfiddle.net/8gfYZ/11/ Check here..

$(function(){
    
    $('#check').click(function(){
        if( $('#myButton').prop('disabled') ) { 
            alert('disabled'); 
            $('#myButton').prop('disabled',false);
        } 
        else {
            alert('enabled');
            $('#myButton').prop('disabled',true);
        }
    });
});

Solution 8 - Javascript

To see which options have been set on a jQuery UI button use:

$("#deliveryNext").button('option')

To check if it's disabled you can use:

$("#deliveryNext").button('option', 'disabled')

Unfortunately, if the button hasn't been explicitly enabled or disabled before, the above call will just return the button object itself so you'll need to first check to see if the options object contains the 'disabled' property.

So to determine if a button is disabled you can do it like this:

$("#deliveryNext").button('option').disabled != undefined && $("#deliveryNext").button('option', 'disabled')

Solution 9 - Javascript

$('#StartButton:disabled') ..

Then check if it's undefined.

Solution 10 - Javascript

You can use jQuery.is() function along with :disabled selector:

$("#savematerial").is(":disabled")

Solution 11 - Javascript

What worked for me was this:

$("#testButton").hasClass('ui-state-disabled')

But I like tomwadley's answer a lot more.

Nevertheless, the is(':disabled') code does also not work for me which should be the best version. Don't know, why it does not work. :-(

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRickardPView Question on Stackoverflow
Solution 1 - JavascriptVivekView Answer on Stackoverflow
Solution 2 - JavascriptkinakutaView Answer on Stackoverflow
Solution 3 - JavascriptRostyslav ZhalivtsivView Answer on Stackoverflow
Solution 4 - JavascriptlancscoderView Answer on Stackoverflow
Solution 5 - JavascriptMina GabrielView Answer on Stackoverflow
Solution 6 - JavascriptKaidoView Answer on Stackoverflow
Solution 7 - JavascriptjackkorbinView Answer on Stackoverflow
Solution 8 - JavascriptTom WadleyView Answer on Stackoverflow
Solution 9 - JavascriptMichael WrightView Answer on Stackoverflow
Solution 10 - JavascriptSiva RaguView Answer on Stackoverflow
Solution 11 - JavascriptJohn ArcherView Answer on Stackoverflow