Handling disabled checkboxes/radio buttons
  • I am having problems handling a disabled checkbox. The html is fine but no matter what I can still click in the textbox to change its state.
    is there a way I am missing to handle this please?
    Thanks
    Andy
  • I had the same problem. I'm not at all sure, but I think that the checkboxes and radio buttons are indeed disabled, it's just that the images don't reflect the condition. You can fix this problem adding a condition to the "click" binding in the prettyCheckboxes.js file to cancel any action if the input is disabled.

    In my case, I used this:

    [...]
    $label.bind("click",function() {
    if ($(this).attr("disabled").is(":true")) {
    return false;
    } else {
    $("input#"+$(this).attr("for")).triggerHandler("click");
    [...]
    }
    }
    [...]

    I didn't do an exhausting testing, but at least it seems to work in Chrome, IE8 and IE9. The hole code for prettyCheckboxes.js is as follow (sorry for the lack of indentation, I don't know how to post code in this forum):

    jQuery.fn.prettyCheckboxes=function(a) {
    a=jQuery.extend( {checkboxWidth:17,checkboxHeight:17,className:"prettyCheckbox",display:"list"},a);
    $(this).each(function() {
    $label=$('label[for="'+$(this).attr("id")+'"]');
    $label.prepend("");
    if ($(this).is(":checked")) {
    $label.addClass("checked")
    }
    $label.addClass(a.className).addClass($(this).attr("type")).addClass(a.display);
    $label.find("span.holderWrap").width(a.checkboxWidth).height(a.checkboxHeight);
    $label.find("span.holder").width(a.checkboxWidth);
    $(this).addClass("hiddenCheckbox");
    $label.bind("click",function() {
    if ($(this).attr("disabled").is(":true")) {
    return false;
    } else {
    $("input#"+$(this).attr("for")).triggerHandler("click");
    if ($("input#"+$(this).attr("for")).is(":checkbox")) {
    $(this).toggleClass("checked");
    $("input#"+$(this).attr("for")).checked=true;
    $(this).find("span.holder").css("top",0)
    } else {
    $toCheck=$("input#"+$(this).attr("for"));
    $('input[name="'+$toCheck.attr("name")+'"]').each(function() {
    $('label[for="'+$(this).attr("id")+'"]').removeClass("checked")
    }
    );
    $(this).addClass("checked");
    $toCheck.checked=true
    }
    }
    }
    );
    $("input#"+$label.attr("for")).bind("keypress",function(b) {
    if (b.keyCode==32) {
    if ($.browser.msie) {
    $('label[for="'+$(this).attr("id")+'"]').toggleClass("checked")
    } else {
    $(this).trigger("click")
    }
    return false
    }
    }
    )
    }
    )
    }
    ;
    checkAllPrettyCheckboxes=function(b,a) {
    if ($(b).is(":checked")) {
    $(a).find("input[type=checkbox]:not(:checked)").each(function() {
    $('label[for="'+$(this).attr("id")+'"]').trigger("click");
    if ($.browser.msie) {
    $(this).attr("checked","checked")
    } else {
    $(this).trigger("click")
    }
    }
    )
    } else {
    $(a).find("input[type=checkbox]:checked").each(function() {
    $('label[for="'+$(this).attr("id")+'"]').trigger("click");
    if ($.browser.msie) {
    $(this).attr("checked","")
    } else {
    $(this).trigger("click")
    }
    }
    )
    }
    };

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Login with Facebook Sign In with Google Sign In with OpenID Sign In with Twitter