Cannot Disable/Enable a button

[Nick_F_2]

Hi

I have this Javascript:

function salesType(){

    var saleschecked = $('#salesType').prop("checked");
    localStorage.setItem("salesType",true);
    if (saleschecked == true) {
   $("#atbutton").removeAttr("disabled");
        $('#sales').prop('readonly', true);
    }
    else
        {
    $("#atbutton").attr("disabled", "disabled");
    $('#sales').prop('readonly', false);
        }
}

and this HTML

<div class="ui-checkbox widget uib_w_65 CheckboxMargin CheckboxWidth" data-uib="jquery_mobile/checkbox" data-ver="0">
                        <label>Input Sales
                            <input type="checkbox" onclick="javascript:salesType()" name="salesType" id="salesType" data-mini="true">
                        </label>
                    </div>
                    <div class="table-thing with-label widget uib_w_66 d-margins UpperWidths LabelText InputText" data-uib="jquery_mobile/input" data-ver="0">
                        <label class="narrow-control label-inline" for="sales">Sales</label>
                        <input class="wide-control" type="number" data-mini="true" value="0" name="sales" id="sales">
                    </div>
                    <a class="widget uib_w_67 d-margins" data-uib="jquery_mobile/button" data-ver="0" data-role="button" id="atbutton" name="atbutton" disabled="disabled">Advanced Data</a>

On page load the Advanced Data button should be disabled and when I check the checkbox, the Sales input becomes readonly as required, but the Advanced Data button is always enabled, I cannot swap between disabled and enabled on checkbox click.

Any thoughts please.

[Hamilton_Tenório_da_]

Try 

$('#atbutton').prop('checked', false);

[Nick_F_2]

Hi Thanks for your help, but that doesn't work.

Also I am trying to disable a button not check/uncheck a checkbox.
 

[Nick_F_2]

Bump

[Diego_Calp]

Hi,

With AF3 this work for me:

$("#atbutton").prop("disabled",true);

Regards

Diego

[Nick_F_2]

Nope tried that before and tried it again, but the button refuses to change state.

[Diego_Calp]

Strange, I just tried it again. The button remains unchanged, but not respond to clicks. If I change with the same method to disabled = false, it is working again.

Are you using App Framework 3 or other?

[Nick_F_2]

I'm using jQuery Mobile. Its an app I've been working on for a while.

[Diego_Calp · Accepted solution]

OK.

XDK creates JQM buttons as link buttons. They don't have methods as enable disable associated.

http://demos.jquerymobile.com/1.2.0/docs/buttons/buttons-methods.html

Link buttons (<a> element) doesn't have a disabled property. You need to use a workaround like this:

http://stackoverflow.com/questions/6438659/how-to-disable-a-link-button-in-jquery-mobile

Regards,

Diego

[Nick_F_2]

Thats a very good point, hadn't considered that.

I will take a look at the links you have posted. Many thanks.