☀ Check out our new pay-what-you-want Webflow portfolio template — Exhibit
Guides
snippets
Toggle Input Field Visibility Base...

Toggle Input Field Visibility Based on Checkbox or Radio Buttons

November 22, 2022

Sometimes you want to create a bit more advanced forms than Webflow allows for natively. The following code will let you toggle the visibility of an input field based on if a checkbox or a radio button is ticked or not.

The code requires you to have an input with the classname of "toggle" and an checkbox / radio button with the classname of "optional" within the same form.

$(document).ready(function () {
  $("input.toggle").click(function () {
    $("input.optional").toggle($(this).is(":checked"));
  });
});