Web Development Lab – Forms
Objective:
To understand and implement HTML form elements, attributes, and form handling.
Task 1: Basic Form
Create a simple registration form that contains the following fields:
- Full Name (Text field)
- Email (Email field)
- Password (Password field)
- Submit button
Task 2: Student Admission Form
Design a form with the following input types:
- Student Name (text)
- Age (number)
- Gender (radio buttons: Male/Female)
- Date of Birth (date picker)
- Department (dropdown list: CS, IT, SE, AI)
- Submit & Reset button
Task 3: Feedback Form
Create a feedback form with:
- Name
- Email
- Rating (1–5 using radio buttons)
- Feedback (textarea)
- Checkbox: “Subscribe to Newsletter”
- Submit button
Task 4: Job Application Form
Develop a form that collects:
- Applicant Name
- Email
- Phone Number
- Upload Resume (file input)
- Select Skills (checkboxes: HTML, CSS, JS, PHP)
- Preferred Job Type (select menu: Full-Time, Part-Time, Remote)
- Submit button
Task 5: Advanced Form with Validation
Create a signup form with:
- Username (text, required, min length 5)
- Email (email, required)
- Password (password, required, minlength 8)
- Confirm Password (password, must match above)
- Agree to Terms & Conditions (checkbox, required)
- Submit button
Guidelines:
👉 Each task should include proper use of <form>, <label>, and attributes like required,
placeholder, and name.
👉 Apply basic CSS styling (borders, spacing, colors) to make forms user-friendly.
