When you submit a checkbox field in Webflow Forms, its value defaults to true
(when checked). To make the form submit a custom value like the label name, you'll need to modify the checkbox using custom attributes and a bit of JavaScript.
Webflow checkboxes submit a static value (true
) by default. To override this:
newsletter-subscription
).true
unless you change it using code.data-label-value
Subscribe to Newsletter
)This does not change functionality yet—it just stores the label text.
You’ll need to inject JavaScript into the page to modify the checkbox’s value
when the form is submitted:
Open the Page Settings (for the page with the form).
Scroll to Before
tag and paste this script (no tags shown due to formatting rules):
Replace checkbox-name
with the Name attribute of your checkbox (e.g., newsletter-subscription
).
```
```
Publish your site for the changes to take effect.
Checkboxes don't submit any value when they are unchecked. If needed, create a hidden input with the same name and default value to catch the "off" case.
newsletter-subscription
).Not Subscribed
or similar.To show the checkbox label as the submitted value in Webflow Forms, use a custom attribute to hold the label text and run a short JavaScript snippet on form submission to update the checkbox’s value. Optionally, add a hidden field for handling unchecked cases.