The formdata event fires when a form's entry list is constructed. It provides a FormData object that code can update without rebuilding every successful control by hand.

const form = document.querySelector("form");

form.addEventListener("formdata", (event) => {
  event.formData.set("source", "account-settings");
});

Use the right operation

  • set replaces any existing value for a name.
  • append adds another value when the field is intentionally repeated.
  • Disabled controls and controls without a name are not included as successful form entries.

Keep server validation authoritative

A browser-side field or hidden value is not proof of authorization. Validate important fields, ownership, and permissions on the server that receives the request.

Test with duplicate field names and with a form that has multiple submit buttons so the final data matches the intended submission.