In this post we’ll look at how we can use checkboxes and radio buttons to conditionally enable or disable other inputs for forms.
First we’ll activate input forms by checking a checkbox.
[codepen_embed height=”265″ theme_id=”0″ slug_hash=”NaBezL” default_tab=”result” user=”benalexkeen”]See the Pen NaBezL by Ben (@benalexkeen) on CodePen.[/codepen_embed]
If we wanted to do the opposite and deactivate form inputs based on a checkbox, we can just remove our != sign and use a regular = sign
[codepen_embed height=”265″ theme_id=”0″ slug_hash=”MEBZzM” default_tab=”result” user=”benalexkeen”]See the Pen MEBZzM by Ben (@benalexkeen) on CodePen.[/codepen_embed]
What if we had multiple inputs that we wanted to pick using a radio button. We can achieve this by the following:
[codepen_embed height=”265″ theme_id=”0″ slug_hash=”EwpGdV” default_tab=”result” user=”benalexkeen”]See the Pen EwpGdV by Ben (@benalexkeen) on CodePen.[/codepen_embed]