Form Stuck Loading After Submit
The user clicks submit. A spinner appears. It spins forever. They don't know if their submission went through or not. This is one of the most frustrating form experiences.
"Stuck loading" usually means one of three things: the request never reached the server, the server is processing but not responding, or the response came back but the frontend didn't handle it.
Diagnosing the problem
Open browser DevTools (F12) → Network tab before reproducing the issue.
| What you see | Problem location | Next step |
|---|---|---|
| No request sent | Frontend JavaScript | Check console for errors |
| Request pending | Server not responding | Check server logs |
| Request failed (red) | Network or server | Check status code |
| Request succeeded | Frontend handler broken | Check response + JS errors |
Check in this order:
- Console errors — JavaScript error before submit prevented the request
- Network request — Was the request sent? What status code?
- Response body — Did the server return an error message?
- Server logs — Is the request reaching the server at all?
Common causes and fixes
JavaScript error prevents submit
The form's submit handler crashes before sending the request.
Symptoms: No network request appears. Console shows JavaScript error.
Fix: Check the console for errors. Common culprits:
- Form validation script failing
- Analytics or tracking scripts interfering
- Third-party plugins conflicting
Request timeout
The server takes too long to respond and the browser gives up.
Symptoms: Request shows as "pending" for 30+ seconds, then fails.
Fix:
- Check server for slow database queries or external API calls
- Increase timeout limits if the operation legitimately takes long
- Add async processing for long operations
Server returns error
The request reaches the server but fails during processing.
Symptoms: Request shows red/failed, status code 500 or 4xx.
Fix:
- Check server error logs for the stack trace
- Common causes: validation failure, database error, missing permissions
Response not handled
The server responds successfully but the frontend doesn't handle it.
Symptoms: Request shows green/successful, but UI stays stuck.
Fix:
- Check that the response format matches what frontend expects (JSON vs HTML)
- Verify the success handler runs (add console.log)
- Check for JavaScript errors after response
Preventing stuck forms
Good form implementations prevent this entirely:
Set reasonable timeouts: Don't let requests hang forever. Show a clear error after 30 seconds.
Handle all response types: Success, validation error, server error, timeout, network failure — each needs different user feedback.
Disable double-submit: Disable the button after first click to prevent duplicate submissions from impatient users.
Show clear feedback: "Submitting..." is better than a generic spinner. "Submission received" is better than just removing the spinner.
Use error monitoring to catch submit handler failures automatically rather than waiting for user complaints.
Related pages
Parent: Form Failures — Complete form debugging guide
Siblings:
- Form Not Sending — When forms fail silently
Pillar: Common Fixes — Solutions for frequent issues