2

I have a form with a multiple choice field A

<select multiple="multiple" name="A"></select>

and a boolean checkbox B

<input type="checkbox" name="B" />

I want to disable field A if field B is checked. If field B gets unchecked, I want to re-enable field A again.

I tried this:

$('input[name="B"]').toggle(function() {
    $('select[name="A"]').addClass('uneditable-input').attr('disabled', 'disabled');
}, function() {
    $('select[name="A"]').removeClass('uneditable-input').removeAttr('disabled');
});

However, this does not work. Instead, it makes the checkbox disappear from my webpage. How can I achieve what I described above?

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
pemistahl
  • 9,304
  • 8
  • 45
  • 75
  • 1
    Function toggle event has been removed in 1.9. He is not wrong and it is a bit confusing they just removed it – mplungjan Feb 17 '13 at 12:12
  • possible duplicate of [Where has fn.toggle( handler(eventObject), handler(eventObject)...) gone?](http://stackoverflow.com/questions/14301935/where-has-fn-toggle-handlereventobject-handlereventobject-gone) – mplungjan Feb 17 '13 at 12:14
  • @mplungjan Indeed, they removed the toggle event. I was using the toggle animation method instead. But the toggle event is still documented [here](http://api.jquery.com/toggle-event/) and the remark that it has been removed is quite tiny. I just overlooked it. – pemistahl Feb 17 '13 at 12:15
  • @PeterStahl: Easily done! – T.J. Crowder Feb 17 '13 at 12:17
  • @downvoter: No need to downvote this. I'm sure there are even more people who have overlooked that the toggle event was removed in jQuery 1.9 because it's not very apparent in the docs. A remark instead of a downvote would have been more suitable since the question is still useful. – pemistahl Feb 17 '13 at 12:25

1 Answers1

3

How can I achieve what I described above?

Instead of toggle, use click to hook up a (single) handler, and then within the handler, check this.checked to see whether B is checked.

$('input[name="B"]').click(function() {
    if (this.checked) {
        $('select[name="A"]').addClass('uneditable-input').attr('disabled', 'disabled');
    }
    else {
        $('select[name="A"]').removeClass('uneditable-input').removeAttr('disabled');
    }
});
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • @mplungjan: Yeah, thanks, I just removed the first bit after seeing your comment on the question and dashing off to the docs. I didn't know that version of `toggle` existed! (And I suppose, I can go ahead and forget about that now... ;-) ) – T.J. Crowder Feb 17 '13 at 12:14
  • Yes, it was not a known function and you are not the first doing the RTFM in the face of a poor unsuspecting victim ;))) – mplungjan Feb 17 '13 at 12:15
  • @T.J.Crowder Thank you, your solution works fine. :) I just upgraded to jQuery 1.9 and wasn't aware that the toggle event was removed. The note in the docs is not very apparent, that's why I overlooked it. – pemistahl Feb 17 '13 at 12:23
  • @PeterStahl: Yeah, easily done! (I'd completely forgotten that version of `toggle` even existed... Clearly it was *I* who needed to re-read the docs!) – T.J. Crowder Feb 17 '13 at 12:23