Forms, Validation, and CSRF Protection

Every form should be treated as untrusted input. This lesson walks through validation rules, input normalization, CSRF tokens, and the POST-redirect-GET pattern.

The result is a form that behaves predictably under normal use and fails safely when the request is malformed.

Edit the panels below and press Run to preview. Nothing you type here is saved — refreshing the page restores the original starter code.

<form class="contact-form">\n  <label for="name">Name</label>\n  <input id="name" type="text">\n\n  <label for="email">Email</label>\n  <input id="email" type="email">\n\n  <button type="submit">Send</button>\n</form>

.contact-form {\n  max-width: 30rem;\n  display: grid;\n  gap: 0.75rem;\n}\n\ninput, button {\n  padding: 0.8rem 0.9rem;\n  border: 1px solid #d0d0d0;\n  border-radius: 6px;\n}

// The PHP lesson demonstrates CSRF on the server side.\nconsole.log("CSRF lesson loaded");