CodexBloom - Programming Q&A Platform

HTML `<form>` not submitting data to server when using `<input type='file'>` in Chrome 117

👀 Views: 368 💬 Answers: 1 📅 Created: 2025-08-25
html forms chrome file-upload HTML

I'm working through a tutorial and Hey everyone, I'm running into an issue that's driving me crazy. I'm sure I'm missing something obvious here, but I'm experiencing an scenario where my HTML form is not submitting correctly when it includes an `<input type='file'>` element, especially in Chrome version 117. The form data does not reach the server, and I'm not receiving any errors in the console. Here's the relevant snippet of my form: ```html <form id="myForm" action="/upload" method="post" enctype="multipart/form-data"> <input type="file" name="fileUpload" required /> <input type="submit" value="Upload" /> </form> ``` I've ensured that the `enctype` is set to `multipart/form-data`, which is necessary for file uploads. However, when I submit the form, the network tab shows no request being made. I've tried adding an event listener to the form submission to log data: ```javascript const form = document.getElementById('myForm'); form.addEventListener('submit', (event) => { event.preventDefault(); const formData = new FormData(form); console.log([...formData]); // This logs an empty array }); ``` Despite the presence of a file in the input, the `FormData` object is empty when I log it. I’ve tested this in Firefox and it works as expected, but I want to seem to pinpoint the scenario in Chrome. I also checked for any potential issues with browser extensions that could interfere, but nothing stands out. Has anyone else faced this scenario with file uploads in Chrome, and if so, how did you resolve it? Has anyone else encountered this? Has anyone else encountered this?