jQuery Disable Multiple Dropdowns Not Working

Question

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 closed. I am using the following jQuery to disable the drop down if it is checked:

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

However, when the checkbox is selected only the open hours is disabled/enabled... The closed dropdown seems to be getting ignored.

You might want to look at the prop() method if you're using 1.7.+ — Jay Blanchard
– Jay Blanchard, Commented Mar 12, 2012 at 16:58

Diodeus - James MacFarlane · Accepted Answer · 2012-03-12 17:07:57Z

5

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.

edited Mar 12, 2012 at 17:07

answered Mar 12, 2012 at 16:55

Diodeus - James MacFarlane

115k33 gold badges164 silver badges180 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Help Inspire · Accepted Answer · 2012-03-12 17:00:54Z

0

    $("#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");
      }
    });

answered Mar 12, 2012 at 17:00

Help Inspire

3666 silver badges24 bronze badges

Comments

bdparrish · Accepted Answer · 2012-03-12 17:02:47Z

0

$("#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/

answered Mar 12, 2012 at 17:02

bdparrish

2,7844 gold badges40 silver badges62 bronze badges

Collectives™ on Stack Overflow

jQuery Disable Multiple Dropdowns Not Working

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related