HTML <form> submission unexpectedly includes hidden input values from previous submissions
I'm encountering an issue where my HTML form is somehow including hidden input values from previous submissions when I reset the form. I have a simple form designed to take user input for a feedback section, but after a user submits the form, the hidden inputs retain their values, causing subsequent submissions to have incorrect data. Here's a simplified version of my form: ```html <form id="feedbackForm" action="/submit-feedback" method="POST"> <input type="text" name="username" required /> <input type="hidden" name="sessionToken" value="abc123" /> <button type="submit">Submit</button> </form> ``` After the form is submitted, I call `reset()` on the form in JavaScript: ```javascript const form = document.getElementById('feedbackForm'); form.reset(); ``` However, when I check the values of the form after the reset, the `sessionToken` still appears to hold its previous value. In the network tab of the developer tools, this leads to multiple submissions of the same session token which is not the intended behavior. I’ve tried manually setting the value of the hidden input to an empty string after reset, but that doesn’t seem to work either. ```javascript form.querySelector('input[name="sessionToken"]').value = ''; // This doesn't clear the value ``` I also tried using a `change` event listener to update the hidden input value upon form submission, but it still retains the old value: ```javascript form.addEventListener('submit', () => { form.querySelector('input[name="sessionToken"]').value = generateNewToken(); // This function generates a new token }); ``` Despite everything I've tried, the hidden input retains its old value in the network request. Is there something I'm missing in how form resets work with hidden inputs? Any insights would be greatly appreciated!