Skip to content

West Midlands | Jan-2026 | Arunkumar Akilan | Sprint 2 | Form Controls#1085

Closed
arunkumarakilan wants to merge 5 commits into
CodeYourFuture:mainfrom
arunkumarakilan:feature/form-controls
Closed

West Midlands | Jan-2026 | Arunkumar Akilan | Sprint 2 | Form Controls#1085
arunkumarakilan wants to merge 5 commits into
CodeYourFuture:mainfrom
arunkumarakilan:feature/form-controls

Conversation

@arunkumarakilan
Copy link
Copy Markdown

@arunkumarakilan arunkumarakilan commented Jan 27, 2026 •
edited
Loading

What does this PR do?

This PR completes the Form Controls task for Sprint 2.

The page includes a simple product selection form built using semantic HTML and accessibility best practices.

Changes made

  • Added a customer details section with name and email inputs
  • Grouped related inputs using <fieldset> and <legend>
  • Added product selection dropdowns for T-shirt colour and size
  • Used placeholder options instead of pre-selected values
  • Marked required fields clearly
  • Updated the footer with author name and exercise title

Testing

  • Opened the page in the browser
  • Tried submitting with missing required fields (Name / Email / T-shirt colour / Size) → browser blocked submission
  • Verified the select placeholders are disabled so the user must choose a valid option
  • Submitted successfully when all fields were completed with valid values

Self checklist

  • PR title follows Region | Cohort | Name | Sprint | Assignment format
  • Task requirements are met
  • Changes tested in browser
  • HTML is semantic and accessible

Questions for reviewer

  • Is the structure of the form clear and semantic?
  • Any suggestions to further improve accessibility?

@netlify
Copy link
Copy Markdown

netlify Bot commented Jan 27, 2026 •
edited
Loading

✅ Deploy Preview for cyf-onboarding-module ready!

Name Link
🔨 Latest commit 4d6d304
🔍 Latest deploy log https://app.netlify.com/projects/cyf-onboarding-module/deploys/6985a4e5190b9f00088b9074
😎 Deploy Preview https://deploy-preview-1085--cyf-onboarding-module.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse		 2 paths audited
Performance: 100 (no change from production)
Accessibility: 100 (no change from production)
Best Practices: 100 (no change from production)
SEO: 86 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions

This comment has been minimized.

Sign in to view
@arunkumarakilan arunkumarakilan changed the title West Midlands | Jan-2026 | Arunkumar Akilan | Sprint 1 | Form Controls West Midlands | Jan-2026 | Arunkumar Akilan | Sprint 2 | Form Controls Jan 27, 2026
@arunkumarakilan arunkumarakilan added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 27, 2026
cjyuan
cjyuan reviewed Feb 5, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • Have you fully tested your implementation to see if the user can submit the form when some of the input is missing?

  • A well-prepared PR makes it easier for reviewers to approve it with minimal back-and-forth.
    Can you take a look at this General Feedback to see if there
    is anything you can do to make your PR more robust and ready?
    Doing so can help speed up the review process.

@cjyuan cjyuan added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Feb 5, 2026
@arunkumarakilan arunkumarakilan added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Feb 5, 2026
cjyuan
cjyuan reviewed Feb 5, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code is free of syntax errors. Good job.

Comment thread Form-Controls/index.html Outdated
Comment thread Form-Controls/index.html Outdated
Comment thread Form-Controls/index.html Outdated
@cjyuan
Copy link
Copy Markdown
Contributor

cjyuan commented Feb 5, 2026

Is the structure of the form clear and semantic?
Any suggestions to further improve accessibility?

Have you tried asking AI these questions?

@cjyuan cjyuan removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Feb 5, 2026
@arunkumarakilan
Copy link
Copy Markdown
Author

arunkumarakilan commented Feb 6, 2026

Is the structure of the form clear and semantic?
Any suggestions to further improve accessibility?

Have you tried asking AI these questions?

Yes — the form structure is clear and semantic. I used header, main, form, fieldset, and legend to group related inputs, and each input/select has a matching label linked using for/id.

For accessibility, I checked that all inputs have associated labels, required fields use native HTML validation, select elements use a disabled placeholder so users must make an explicit choice, autocomplete is added to help users and assistive technologies, and the name field now uses a stricter pattern so it cannot be submitted with only spaces.

I also formatted the code using VS Code’s Format Document feature to improve indentation and readability.

I used AI to review the form for semantic structure, validation edge cases, and accessibility best practices, and applied the suggestions.

@cjyuan
Copy link
Copy Markdown
Contributor

cjyuan commented Feb 6, 2026

Changes look good.

You should also add a "Needs review" label to indicate the PR is ready to be re-reviewed.

@cjyuan cjyuan added Complete Volunteer to add when work is complete and all review comments have been addressed. and removed Reviewed Volunteer to add when completing a review with trainee action still to take. labels Feb 6, 2026
@arunkumarakilan arunkumarakilan added Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Complete Volunteer to add when work is complete and all review comments have been addressed. labels Feb 6, 2026
@arunkumarakilan
Copy link
Copy Markdown
Author

arunkumarakilan commented Feb 6, 2026 via email

@cjyuan
Copy link
Copy Markdown
Contributor

cjyuan commented Feb 6, 2026

You could practice that in future PR. I have already mark this "Complete". :D

@cjyuan cjyuan added Complete Volunteer to add when work is complete and all review comments have been addressed. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. Reviewed Volunteer to add when completing a review with trainee action still to take. labels Feb 6, 2026
@arunkumarakilan arunkumarakilan mentioned this pull request Feb 7, 2026
Open
@illicitonion
Copy link
Copy Markdown
Member

illicitonion commented May 4, 2026

Closing PR because the January ITP run has finished. Feel free to re-open if you're still working on it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@cjyuan cjyuan cjyuan left review comments

Assignees

No one assigned

Labels

Complete Volunteer to add when work is complete and all review comments have been addressed.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@arunkumarakilan @cjyuan @illicitonion