19

I used to bind event to my button like :

$("input[name=add]").live("click",function(){...});

But I got another function to make them "enable" and "disabled" like :

RefreshBox() {

    $("input[name=add]").each(function(){
        if(...)
            $(this).attr("disabled","disabled");
        else
            $(this).attr("disabled","");
    })

}

But in fact that it doesn't work as I expected. Buttons are still can be click and the event still works smoothly.

PS: jQuery 1.4.1 Browser: IE8 , after button disabled still can work. Browser: Chrome, disabled button success.

Ericpoon
  • 267
  • 1
  • 2
  • 11
  • Which version of jQuery are you using? – Joseph Silber Jan 03 '12 at 02:55
  • I am unable to reproduce this problem. See http://jsfiddle.net/liho1eye/yfA8d/ for sample code. I suspect you either not using correct selector or your disabling code is not being called. – Ilia G Jan 03 '12 at 03:12
  • @BookOfZeu It's only a simulated predicate showing my status. Buttons can disabled and enabled, but event still can be triggered when disabled. – Ericpoon Jan 03 '12 at 03:44
  • i need help on this http://stackoverflow.com/questions/20225962/jquery-form-disable-submit-button-until-required-field-entered – user3037917 Nov 26 '13 at 19:27

3 Answers3

44

You'll want to use the prop function instead of attr:

$(this).prop("disabled", true);

and

$(this).prop("disabled", false);

EDIT

OP was using jQuery pre 1.6.1, which was why attr for disabled wasn't working quite right (for older IE). While prop is preferred for disabled, post 1.6.1 attr should (and does) work as well.

Adam Rackis
  • 82,527
  • 56
  • 270
  • 393
  • 1
    Isn't disabled also an attribute? E.g. `disabled="disabled"` – PeeHaa Jan 03 '12 at 03:01
  • If I am reading the question correctly, his issue is that he cannot disable the button, not reenable. – Ilia G Jan 03 '12 at 03:03
  • 2
    @PeeHaa - I'm not an expert here, but the jQuery docs recommend using prop instead of attr for disabled. That OP's problem is with IE8 makes me think this might be one of the edge cases that prop is supposed to take care of – Adam Rackis Jan 03 '12 at 03:04
  • @liho1eye - this SO Q seems to imply otherwise http://stackoverflow.com/questions/7677886/ie7-ie8-interaction-with-jquery-removeattrdisabled-not-applying-css – Adam Rackis Jan 03 '12 at 03:18
  • And as this link implies, it *can* make a difference if OP is using jQuery < 1.6.1 http://stackoverflow.com/questions/6169826/propchecked-false-or-removeattrchecked – Adam Rackis Jan 03 '12 at 03:19
  • @Ericpoon - after updating to 1.7, did using prop like in my answer solve your problem? – Adam Rackis Jan 03 '12 at 03:29
  • @Ericpoon - sorry, I misread your comment. No, you don't have to update to 1.7. Just change your code to use prop like above, and see if that fixes it – Adam Rackis Jan 03 '12 at 03:40
  • @AdamRackis I only download 1.6.1. Problem is solved. I can use $.attr() to disable buttons and they're never trigger the events bind with $.live(). Thanks. – Ericpoon Jan 03 '12 at 03:41
  • @Ericpoon - 1.6.1 put a fix in to make removeAttr behave as it should, which is why it now works, but consider switching your code to use `prop`. That's the recommended way to handle attributes with boolean values—like checked and disabled – Adam Rackis Jan 03 '12 at 03:43
  • @liho1eye - I edited my answer to describe why `attr` was not working for OP, and why `prop` would—as would, as you said, `attr` with a more recent jQuery version. – Adam Rackis Jan 03 '12 at 03:46
  • @AdamRackis I retract my -1 then. – Ilia G Jan 03 '12 at 03:48
  • @AdamRackis Yes, prop() can work very well. But attr("disabled") also can work after 1.6.1. ^_^ – Ericpoon Jan 03 '12 at 04:01
5

Try $("input[type=submit]").removeAttr("disabled"); to enable the button.

Wes Crow
  • 2,971
  • 20
  • 24
3

You can set the 'disabled' attribute to false by using:

$("input[name='add']").attr("disabled","disabled");
zhujy_8833
  • 561
  • 4
  • 6