Chapter 6: WebPages Forms

WebPages Forms in the W3Schools WP Tutorial menu). This is where your pages stop being just “display stuff” and start interacting with users — collecting names, choices, messages, and making decisions based on what they type or select. 😄

Think of forms as the “conversation starter” between your website and the visitor. In real life: you ask “What’s your name?” → they answer → you say “Hi Rahul!”. In Web Pages: same thing, but with code.

Today we’ll go very detailed, step-by-step, like we’re building it together in Visual Studio or WebMatrix (or even Notepad + browser). I’ll use the classic W3Schools examples + extra explanations so you really get it.

1. Core Concept: How Forms Work in ASP.NET Web Pages

• Forms are pure HTML → <form>, <input>, <select>, <textarea>, etc.
• You set method=”post” (almost always — safer than “get”)
• action=”” or action=”samepage.cshtml” → submits back to the same page (postback pattern)
• When user clicks Submit → browser sends data to server via POST
• Server sees it’s a POST → IsPost becomes true
• You read data with Request[“name-of-field”] (or Request.Form[“…”])
• All values come as strings — convert if needed (.AsInt(), .AsDateTime(), etc.)

Golden Rule (write this down!) Always wrap your processing code inside:

This way:

• First visit → clean form
• After submit → show results / thank you / errors

2. Example 1 – Basic Text Input Form (Classic W3Schools Style)

File: SimpleForm.cshtml

Step-by-step what happens:

1. Page loads first time → IsPost = false → shows empty <form>
2. User types “Tata Consultancy” and “Rahul Sharma” → clicks Submit
3. Browser POSTs to same page → IsPost = true
4. Code reads Request[“CompanyName”] → “Tata Consultancy”
5. Displays green thank-you message with values
6. Variables keep values → if you want, you can pre-fill form again (good for “edit” mode)

Pro tip: Always use @ before variables in HTML — Razor escapes them safely (prevents XSS attacks).

3. Example 2 – Dropdown (Select) + Show Image Based on Choice

This is a super common real-world pattern (from W3Schools “Display Images” example).

File: ChoosePhoto.cshtml

Key learning points here:

• <select name=”Choice”> → value goes to Request[“Choice”]
• Build dynamic <img src> using @imagePath
• Check !String.IsNullOrEmpty() before showing image (avoids broken image on first load)
• Put images in /images/ folder (logical path from root)

4. Bonus: Other Common Form Elements (You Should Know)

Add these to your forms:

Read them same way:

5. Important Teacher Warnings & Best Practices (2026)

• Always use method=”post” for anything private (passwords, personal info) — “get” shows data in URL!
• Never trust user input → in real apps, validate/sanitize (we’ll see Helpers later)
• Empty fields → Request[“field”] returns empty string, not null
• Pre-fill form after submit (edit mode) → use value=”@variable” in inputs
• In modern ASP.NET Core → same ideas, but use Tag Helpers + Model Binding + [BindProperty]
• No built-in client validation here (old Web Pages) — later lessons cover Helpers for that

Summary – Closing the Notebook

ASP.NET Web Pages HTML Forms = standard HTML <form> + Razor power:

• IsPost to detect submit
• Request[“name”] to read data
• Same-page postback (action=””)
• Process in if (IsPost) → show results
• Display dynamic content (messages, images, etc.) based on input

This is the foundation for login forms, contact pages, calculators, quizzes — everything interactive!

Ready for next? Tell me:

• Want to add validation (required fields, numbers only)?
• Full contact form with email send (using WebMail)?
• Radio + checkbox processing example?
• Or jump to WebPages Objects (Request, Response deep dive)?

Your turn, Webliance — you’re building real skills here in Hyderabad! Keep it up! 🚀🇮🇳