jquery Disable multiple dropdowns on enable checkbox

Question

A part of my form is a place where users can choose days where they are closed and also the opening hours on days they are open.

I have made a fiddle, this should make it clear.

This form is being generated dynamicly in php because it will need to be multilanguage.

http://jsfiddle.net/ZXSKH/

I need help on how to disable the dropdowns for a specific day when they click the checkbox for being closed on that day.

Also the values will be posted to a database, any idea how i should disable the values of the dropdowns(the opening hours) when they are not open on that day?

Jovan Perovic · Accepted Answer · 2011-11-02 10:25:55Z

1

You mentioned that every input field (checkboxes, dropdowns...) are created dinamically, so use value attribute of each checkbox to trigger enable/disable action.

I have edited your fiddle: http://jsfiddle.net/ZXSKH/16/

I'm afraid I'm not very familiar with MooTools, so I wrote a little script using jQuery but I hope that it could be rewritten using MooTools without much hassle.

Btw, I strongly suggest double-quoting all attributes although I think modern browser can handle this without any problems . Also, I'm pretty sure that for attribute of label is used for element IDs, not names.

I hope this helps a bit...

answered Nov 2, 2011 at 10:25

Jovan Perovic

20.2k5 gold badges47 silver badges92 bronze badges

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

4 Comments

logistef Over a year ago

Wow thanks for editing the fiddle, the only thing is that the dropdowns need to be disabled once the user selects a day. The opposite of how it is now. Would you mind editing that in the fiddle. I would be very gratefull!!

logistef Over a year ago

I have managed to switch it around and it's working in the fiddle now: jsfiddle.net/ZXSKH/30 Any idea why this isnt working in my complete form? Is it because the div is nested into other divs?

logistef Over a year ago

Fixed it,I forgot to add the id for the fieldset. it works in the main form now 2. Thanks alot for the assistance.

Jovan Perovic Over a year ago

Oh sorry, I was away from computer during the whole day... glad I could help you :)

Dilini Rajapaksha · Accepted Answer · 2011-11-02 09:47:51Z

0

You can give an id to the selectboxes and check boxes and use the disabled attribute to disable the select box as below:

$('#id').attr('disabled','disabled');

answered Nov 2, 2011 at 9:47

Dilini Rajapaksha

2,7484 gold badges31 silver badges43 bronze badges

3 Comments

logistef Over a year ago

Any idea on how to clear/change the value once the dropdowns are disabled?

Dilini Rajapaksha Over a year ago

$('#id').find('option').remove() will remove all the options.

Dilini Rajapaksha Over a year ago

And if you want to add new values after removing previous ones, try this: $('#id').find('option').remove().end().append('<option value="val">text</option>');

Ashutosh Mishra · Accepted Answer · 2011-11-02 10:01:00Z

0

you can fire an event on selecting the checkbox and use the above answer as suggested below

answered Nov 2, 2011 at 10:01

Ashutosh Mishra

4072 gold badges6 silver badges16 bronze badges

Collectives™ on Stack Overflow

jquery Disable multiple dropdowns on enable checkbox

3 Answers 3

4 Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related