Manchester | 26-ITP-Jan | Farancis Dore Etonkie | Sprint 2 | Form Control by FarancisGH · Pull Request #1065 · CodeYourFuture/Module-Onboarding

FarancisGH · 2026-01-26T04:20:09Z

Learners, PR Template

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

    1. A text input for the user's name
    2. An email input for the user's email address
    3. A set of radio buttons for selecting a colour (red, blue, green)
    4. A dropdown menu for selecting a size (XS, S, M, L, XL, XXL)
    5. A submit button to send the form data

netlify · 2026-01-26T04:20:14Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`4a95576`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/6985a1b2de808800083988c1
😎 Deploy Preview	https://deploy-preview-1065--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: 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.

cjyuan

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

Suggestion: Share your code to an AI tool and ask it to review your code in terms of semantic, accessibility, typo, and consistency.
It can often help us catch errors, improve consistency, and reinforce best practices.

cjyuan · 2026-02-03T08:18:59Z

+        <label for="red">Red</label>
+        <input type="radio" id="red" name="Available colours" value="red" required />


Can consider wrapping the radio button input within the label. This way, we don't need to use the for and id attributes.

<label>Red <input type="radio" name="Available colours" value="red" required> </label>

Can you find out from AI about "general practice of using mixed letter cases and space in name attributes"?

cjyuan · 2026-02-03T08:21:28Z

+        <fieldset>
+          <legend>Enter your Name</legend>
+          <strong><label for="name">Name</label></strong>
+          <input type="text" id="name" name="name" required />


Currently a user can enter a name consisting of only space characters (e.g., " "). Can you enforce a stricter validation rule using the pattern attribute to disallow any name that contains only space characters?

Hello @cjyuan ,
Thank you for your review and feedback. I have made the changes and adjustments you requested to my Form Control. Please can you review?

Thank you.

cjyuan · 2026-02-04T01:23:59Z

+        <label id="Availablecolours">Available colours:</label>
+        <label>Red
+        <input type="radio" name="Available colours" value="red" required>
+        </label>
+        <label>Blue
+        <input type="radio" name="Available colours" value="blue" required>
+        </label>
+        <label>Green
+        <input type="radio" name="Available colours" value="green" required>
+        </label>


You could also consider using VSCode's "Format Document" feature auto format the code.
Once advantage of using it is that it can help us format the code in a consistent way.
To use the feature, right-click inside the code editor and select the option.

cjyuan · 2026-02-04T01:26:08Z

+         <p><b>Select a colour</b></p>
+        <label id="Availablecolours">Available colours:</label>
+        <label>Red
+        <input type="radio" name="Available colours" value="red" required>


Did you ask AI about general practice of using mixed letter cases and space in the 'name' attribute?

cjyuan · 2026-02-04T01:34:26Z

+          <input type="email" name="email" required>
+          </label>
+          </p>
+         <p><b>Select a colour</b></p>


May I suggest using an AI tool to identify ways to improve the semantics of the HTML code? (There are elements more suitable than <p> and <b> for accomplishing what you try to achieve)

cjyuan · 2026-02-04T01:36:44Z

+          <input type="radio" name="Available sizes" value="ExtraSmall" required>
+          </label>
+          <label>S
+          <input type="radio" name="Available sizes" value="Small" required>
+          </label>
+          <label>M
+          <input type="radio" name="Available sizes" value="Medium" required>
+          </label>
+          <label>L
+          <input type="radio" name="Available sizes" value="Large" required>
+          </label>
+          <label>XL
+          <input type="radio" name="Available sizes" value="ExtraLarge" required>
+          </label>
+          <label>XXL
+          <input type="radio" name="Available sizes" value="DoubleExtraLarge" required>
+          </label>


Part of this code is redundant and can be slightly simplified. Can you figure out the redundant part and remove them?

Hello @cjyuan
Please, I have made the necessary changes you asked me to make to my Form control. Can you please review it?

…cing reduntancy in the HTML code.

cjyuan

Changes look good mostly. Just one request.

Note: You forgot to add the "Needs review" label.

cjyuan · 2026-02-06T03:01:04Z

+      <fieldset>
+        <legend>Product Information</legend>
+
+        <p>Select a colour:</p>


"Select a colour:" does not seem like a paragraph in an article.
To improve the semantic of the markups, can you replace the <p> element by the generic block-level element?

@cjyuan Please review.

It seems I was incorrect. I was thinking <div> might be more appropriate than <p>, but upon checking with AI, it suggested <p> is more appropriate than <div> or <label>.

I won't go into details, you can ask AI yourself to find out more.

All good.

…aph.

illicitonion · 2026-05-04T17:04:25Z

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

Modifications made on the form control page.

ebfdb7a

FarancisGH added 📅 Sprint 2 Assigned during Sprint 2 of this module Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. Module-Onboarding The name of the module. labels Jan 26, 2026

cjyuan reviewed Feb 3, 2026

View reviewed changes

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 3, 2026

CORRECTIONS MADE ON THE FORM-CONTROL HTML FILE AFTER REVIEW.

91f5107

cjyuan reviewed Feb 4, 2026

View reviewed changes

Adjustments made on spacing, mixed cases, improving sematics and redu…

2b7c953

…cing reduntancy in the HTML code.

cjyuan reviewed Feb 6, 2026

View reviewed changes

Adjusted the <p> tag in the html to <label> since it was mot a paragr…

4a95576

…aph.

FarancisGH added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Feb 6, 2026

FarancisGH mentioned this pull request Feb 10, 2026

26-ITP-Jan | Onboarding | Farancis Dore Etonkie FarancisGH/My-Coursework-Planner#5

Open

illicitonion closed this May 4, 2026

		<label for="red">Red</label>
		<input type="radio" id="red" name="Available colours" value="red" required />

Uh oh!

Conversation

FarancisGH commented Jan 26, 2026

Learners, PR Template

Changelist

Uh oh!

netlify Bot commented Jan 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for cyf-onboarding-module ready!

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

illicitonion commented May 4, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

netlify Bot commented Jan 26, 2026 •

edited

Loading