Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disabling JQuery Mobile button with JQuery

this is my JQuery mobile button. This is probably an easy one. Im able to disable a html button but i cant seem to get it with this mark up.

<a href="" data-role="button"  class="answer_but" id="a" data-theme="b" data-answer="1">

This is probably an easy one. Thanks

like image 711
L-Samuels Avatar asked May 14 '11 22:05

L-Samuels


People also ask

How do I disable a button in jQuery?

To disable a button with jQuery you need to set the disabled property on the button using the prop method. For example $('. my-button'). prop('disabled', true) .

Is jQuery Mobile outdated?

jQuery Mobile is no longer supported.

How do you disable a button element?

To disable a button using only JavaScript you need to set its disabled property to false . For example: element. disabled = true . And to enable a button we would do the opposite by setting the disabled JavaScript property to false .


3 Answers

Disable Buttons in jQuery Mobile

Live Example: http://jsfiddle.net/XRjh2/16/

UPDATE:

Link button example:

  • http://jsfiddle.net/gRLYQ/6/

JS

var clicked = false;

$('#myButton').click(function() {
    if(clicked === false) {
        $(this).addClass('ui-disabled');
        clicked = true;
        alert('Button is now disabled');
    } 
});

$('#enableButton').click(function() {
    $('#myButton').removeClass('ui-disabled');
    clicked = false; 
});

HTML

<div data-role="page" id="home">
    <div data-role="content">

        <a href="#" data-role="button" id="myButton">Click button</a>
        <a href="#" data-role="button" id="enableButton">Enable button</a>

    </div>
</div>

NOTE: - http://jquerymobile.com/demos/1.0rc2/docs/buttons/buttons-types.html

Links styled like buttons have all the same visual options as true form-based buttons below, but there are a few important differences. Link-based buttons aren't part of the button plugin and only just use the underlying buttonMarkup plugin to generate the button styles so the form button methods (enable, disable, refresh) aren't supported. If you need to disable a link-based button (or any element), it's possible to apply the disabled class ui-disabled yourself with JavaScript to achieve the same effect.

like image 62
Phill Pafford Avatar answered Sep 20 '22 12:09

Phill Pafford


You can just set the class to "ui-disabled" for almost any element or button to disable it.

<a data-role="filter-button" data-timeframe="month" class="ui-disabled">Date</a>
like image 27
Tyler Sammy Avatar answered Sep 18 '22 12:09

Tyler Sammy


Hmmm - Try this (assuming 'a' is the id of your jqm button):

// To disable
$("#a").attr("disabled","disabled");

// and enable
$("#a").attr("disabled","");
like image 36
Jay Are Avatar answered Sep 21 '22 12:09

Jay Are