Form Stage 2: Input Types

Exercise: Form Stage 2 - Input Types

Objectives

In this stage, you will:

• Learn about different input types beyond text
• Understand checkboxes and radio buttons
• Practice using select dropdowns
• Solve the next treasure hunt challenge
• Continue building form skills

Input Types You’ll Encounter

Multiple Choice Inputs:

• type="radio" - Select ONE option (mutually exclusive)
• type="checkbox" - Select MULTIPLE options
• <select> - Dropdown list of options
• <textarea> - Multi-line text input

Other Useful Types:

• type="number" - Numeric input
• type="date" - Date picker
• type="email" - Email validation
• type="password" - Masked text

Form Attributes Used

• name - Groups radio buttons together
• value - The data sent when selected
• checked - Pre-select an option
• multiple - Allow multiple selections in select

The Challenge Continues

Your treasure hunt continues! Complete the challenge in Stage 2 to unlock Stage 3.

Accessibility Tips

• Always label your inputs, even checkboxes and radio buttons
• Use <fieldset> and <legend> to group related inputs
• Radio buttons with the same name are automatically grouped
• Users should be able to click on the label text to select

Next Steps

1. Try selecting different input types
2. Notice how radio buttons work together
3. Explore the select dropdown options
4. Answer the clue and move to Stage 3!