JQuery Mobile, how to check if a button is disabled?

Question

I will disable this button on my jQuery Mobile webpage:

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

and I can turn it on with

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

But how can I check if a button is disabled or enabled?

This command gives "undefined":

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

Some ideas?

Edit: I found out that $ ("# deliveryNext"). button ('disable') only seams to change the style of the button, the click works fine after I need to disable the button, how to do it. I tried .attr ('disabled', 'disabled'), but when I then test .attr ('disabled'), I get undefined ...

Edit2: more about my "real" problem in How to disable a link in jQuery Mobile?

Answer 1

try :is selector

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

Answer 2

Use .prop instead:

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

Answer 3

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> 

Answer 4

I had the same problem and found that this works:

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

If this gives you undefined, you can also use the if condition.

When you evaluate undefined , it will return false .

Answer 5

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); } }); }); 

Answer 6

Try

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

Answer 7

To find out what options were set on the jQuery UI button, use:

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

To check if you are disabled, you can use:

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

Unfortunately, if the button was not explicitly enabled or disabled earlier, the above call will simply return the button object itself, so you 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') 

Answer 8

$ ('# StartButton: disabled') ..

Then check if it is undefined.

Answer 9

What worked for me:

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

But I like that tomwadley will answer a lot more.

However, the is (': disabled') code also does not work for me, which should be a better version. Not sure why this is not working .: - (

Answer 10

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

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

Answer 11

Faced with the same problem when trying to check if a button is disabled. I tried various 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 , while others, such as .attr('disabled') , returned the wrong result - false when the button was actually disabled.

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

So, to determine if the button is disabled, follow these steps:

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