OnlineCBT
Handle the form's submit event
Listen on the form rather than only a button click so keyboard submission follows the same validation path. preventDefault cancels the browser's normal submission when the event is cancelable; it does not validate data or send a request by itself.
Enter Asha and 82, then submit: expect Asha: 82. Native input constraints provide initial checks; the handler also validates its own requirements. Required does not reject a string containing only spaces, so the trimmed name check matters.
FormData details
Controls need a name to contribute values. Disabled controls and unchecked checkboxes have special submission behavior; do not assume every visible field appears. Use getAll when repeated controls share a name. A button with no explicit type inside a form defaults to submit, so auxiliary controls should use type=button.
Client checks are not enforcement
The server must validate again and derive identity/permissions from trusted authentication. A user can bypass the UI. For an async submission, show pending state, avoid accidental duplicate actions and restore controls after failure. A disabled button alone cannot guarantee one server-side write.
Practice
- Submit by pressing Enter in a field.
- Test whitespace-only name, score zero and invalid score 101.
- Add a Reset button with an explicit type and verify its intended behavior.
- Explain why preventDefault does not stop event propagation or save data automatically.
