Some values missing from form submission

Support
1

I’m using a React app deployed to Netlify with a working form that includes checkboxes for sms and marketing consent. These fields:

<input type="checkbox" name="sms" value="Yes" />
<input type="checkbox" name="marketing" value="Yes" />

are rendered correctly in the DOM, and the submission payload confirms they are being submitted correctly:

{
  "sms": "Yes",
  "marketing": "Yes"
}

However, these fields do not show up in the Netlify form submission dashboard, even though other fields like company and division (also rendered via custom components) do show up without issue.

:white_check_mark: What I’ve Already Tried:

  • Verified that both inputs have valid name attributes and are present in the final HTML at runtime.
  • Updated field names to be kebab-case (sms, marketing) to avoid camelCase issues.
  • Ensured that Form detection is enabled in the Netlify site settings.
  • Confirmed via browser inspection that the checkbox inputs are rendering identically to working fields.
  • Successfully submitted several test entries — the sms and marketing values show in the request payload, but not in the dashboard UI.
  • Also tried changing initial state from false to ‘No’ to align with string submission.
  • Did a full redeploy after each test.
2

The primary new step we have taken is to implement a hidden HTML “blueprint” form.

Here are the specifics of what we did:

  1. Added a Hidden Form: We added a separate, hidden <form> to our project. This form includes the data-netlify="true" attribute and has the same name (contact) as our visible React form.
  2. Included All Fields: We explicitly added an <input> tag for every single field that is submitted, paying special attention to the missing ones. The blueprint now contains:
<input type="checkbox" name="sms" />
<input type="checkbox" name="marketing" />
  1. Verified Deployed HTML: After deploying, we used the browser’s “View Page Source” on the live site to confirm that the complete hidden blueprint form—including the sms and marketing inputs—is present in the final static HTML delivered by Netlify.
    Result:

After redeploying with the correct blueprint form in place, we ran new tests. The result is the same: the sms and marketing fields are still not appearing in the Netlify submission dashboard.

Current Status:

We have now confirmed that:

  • The browser is correctly sending the sms and marketing fields in the fetch request payload.
  • The required Netlify “blueprint” form, containing these fields, is correctly configured and present in the final deployed HTML.

Despite both the client-side data and the build-time blueprint being correct, these two specific fields are still being dropped.

Has anyone encountered a situation where Netlify Forms ignores specific fields even when a proper hidden blueprint form is provided? We are looking for any other potential causes for this behavior.

Thank you.

3

Hi, @joshbrown101. Without a link to the live form, I can only guess. I can tell you that this type of issue always has one or both of the following causes:

  • the HTML form does not define the input/field that is missing

  • the form submissions sent by the client-side javascript is sending input/field names that do not match the names in the HTML form

It is almost certainly going to be one or the other above (and maybe even both). If you send us a link to the form in question, we will find the root cause here.

4

Hello everyone,

Just wanted to follow up and close the loop on this topic, as we have successfully solved the issue. Thank you to everyone who read the post and thought about it.

The problem was that our sms and marketing checkbox fields were not being saved, even though we verified they were being sent in the browser payload.

The Root Cause:

The core issue was that our form component was being rendered client-side only. We discovered this by using “View Page Source” on our live site and noticing that the entire form’s HTML—including our hidden “blueprint” form—was not present in the initial static HTML file that Netlify serves.

Because of this, Netlify’s build bots could never see the blueprint form to learn about our new sms and marketing fields. They were likely using an old, outdated schema for our form from a previous deploy, which is why they silently dropped the new, unrecognized fields from our submissions.

The Solution That Worked:

The solution was to force Next.js to pre-render the blueprint form into a dedicated static HTML file that Netlify’s bots could find.

  1. We created a new, unlinked page in our project at pages/forms.js.
  2. Inside this new file, we placed only the hidden HTML blueprint form, containing <input> tags for every single field we might submit (including sms and marketing).
  3. We removed the hidden blueprint form from our interactive React component to keep the code clean.
  4. After redeploying the site, Netlify’s build process discovered the new /forms page, scanned the complete blueprint, and updated our form’s schema on their backend.

All subsequent submissions now correctly save all fields.

Key Takeaway for others: If your fields are being dropped from a JavaScript-driven form submission despite a correct payload, verify with “View Page Source” that your hidden blueprint form is actually present in the initial static HTML. If it’s not, creating a dedicated, unlinked page just for your form blueprints is a robust solution.

1 Like