JQuery Disable Multiple Dropdowns Not Working

I have dropdowns for a business to enter their hours. Each day has a drop down with the ID of hours_dayname_open and hours_dayname_closed. I also have a checkbox to mark it as cl

Solution 1:

The proper attribute, strangely, is disabled, not true.

$("#hours_monday_open").attr("disabled", "disabled");

To enable it, remove the disabled attribute:

$("#hours_monday_open").removeAttribute("disabled");

Since jQuery 1.6, you can use the .prop() functionality to clear/set this.

Solution 2:

    $("#closed_monday").click( function(){
      if($(this).is(':checked')){
        $("#hours_monday_open, #hours_monday_closed").attr("disabled", "disabled");
      }else{
        $("#hours_monday_open, #hours_monday_closed").removeAttribute("disabled");
      }
    });​

Solution 3:

$("#closed_monday").change( function(){
    if($(this).is(':checked')){
        $("#hours_monday_open").attr("disabled", "disabled");
        $("#hours_monday_closed").attr("disabled", "disabled");
    }else{
        $("#hours_monday_open").removeAttribute("disabled");
        $("#hours_monday_closed").removeAttribute("disabled");
    }
});

It is a simple change to .change() and .click(), just the wrong event.

http://jsfiddle.net/6Yr8Q/2/