Cape Town | 26-ITP-May | Juanita Nwachukwu | Sprint 1 | Form Controls by Jay99-prog · Pull Request #1401 · CodeYourFuture/Module-Onboarding

Jay99-prog · 2026-06-02T20:13:09Z

Cape Town | 26-ITP-May | Juanita Nwachukwu | Sprint 1 | Form Controls

Self checklist

I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
My changes meet the requirements of the task
I have tested my changes
My changes follow the style guide

Changelist

Briefly explain your PR.

I created a T-shirt Order form for customers/clients ordering from my business. The fields included: full name, email address, colour choice and preferred size.

netlify · 2026-06-02T20:13:15Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`0c6947f`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/6a1f3958ff14e100081f79a8
😎 Deploy Preview	https://deploy-preview-1401--cyf-onboarding-module.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	2 paths audited Performance: 100 (no change from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 83 (🔴 down 3 from production) PWA: - View the detailed breakdown and full score reports
🤖 Make changes	Run an agent on this branch

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

github-actions · 2026-06-02T20:13:30Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-04T18:17:19Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

Jay99-prog · 2026-06-05T14:02:39Z

Needs Review

github-actions · 2026-06-05T14:02:49Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:02:52Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:04:13Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:04:15Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:14:06Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:18:22Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

github-actions · 2026-06-05T14:18:44Z

Your PR description is incomplete.

You filled out a template (that starts "Learners, PR Template") when you created this PR - you can see it at the top of this page.

Make sure to fill in all fields in the template.

Please ensure:

All self checklist items are ticked (with a [x])
The "Changelist" section is filled with details of what your PR does.
The "Questions" section is either filled in (if you have questions) or is removed (if you don't).

If this PR is not coursework, please add the NotCoursework label (and message on Slack in #cyf-curriculum or it will probably not be noticed).

If this PR needs reviewed, please add the 'Needs Review' label to this PR after you have resolved the issues listed above.

cjyuan · 2026-06-05T16:28:24Z

You need to delete the placeholder text, "Briefly explain your PR." from your PR description to pass the Validation Bot check.

cjyuan

According to https://validator.w3.org/, there are errors in your code. Can you fix them?

cjyuan · 2026-06-05T16:32:49Z

+    <header>T-shirt Order Form
+      <h1>T-shirt Order Form</h1>


Why made "T-shirt Order Form" to appear twice?

cjyuan · 2026-06-05T16:35:04Z

+        <label>
+          <input type="radio" name="colour" value="pink" required>
+          Pink
+        </label>
+
+        <label>
+          <input type="radio" name="colour" value="black" required>
+          Black
+        </label>
+
+        <label>
+          <input type="radio" name="colour" value="blue" required>
+          Blue
+        </label>


Note: For radio buttons within the same group, it is sufficient to mark only one of them as required.

cjyuan · 2026-06-05T16:39:01Z

+        <label for="name">Full Name</label>
+        <input 
+         type="text"
+         id="name"
+         required
+         minlength="5"
+        >


This input element does not yet fully meet the requirement:

Must be at least 2 characters long

Cannot be empty

Currently, string such as "CJ" would be rejected but a string containing exactly 5 space characters would be accepted.

On separate note, can you use an AI to find out "In HTML, what is a placeholder attribute and why using it in input element is considered a good practice?"

cjyuan · 2026-06-05T16:52:04Z

+        <!-- SIZE -->
+        <label for="size">SIZE</label>
+        <select id="size" name="size" required>
+          <option value="">-- Select Size --</option>
+          <option value="XS">XS</option>


The layout of the colour and size controls feels a bit unbalanced. The colour options are presented as a radio group, while the size selector appears immediately afterward without a similar grouping structure. Consider reorganizing these controls (for example, using <fieldset> and <legend> elements) to make the form easier to scan and more visually consistent.

Jay99-prog added 2 commits June 2, 2026 21:51

T-shirt Order form controls

1d440bf

T-shirt Order form controls

0c6947f

Jay99-prog added 📅 Sprint 1 Assigned during Sprint 1 of this module Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jun 5, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026

Jay99-prog added Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. and removed 📅 Sprint 1 Assigned during Sprint 1 of this module labels Jun 5, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026

Jay99-prog added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026

github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026

cjyuan reviewed Jun 5, 2026

View reviewed changes

Uh oh!

Conversation

Jay99-prog commented Jun 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!