Submitted 5 months ago

Contact Form - Vanilla JS

Aakash Verma•9,500

@skyv26

A solution to the Contact form challenge

Preview Code

Solution retrospective

What are you most proud of, and what would you do differently next time?

Did nothing special.

What challenges did you encounter, and how did you overcome them?

well, render the error message using javascript and I find a little tricky to color those radio and checkbox.

What specific areas of your project would you like help with?

All feedback is valuable, and I appreciate suggestions that help me implement accessibility. Additionally, recommendations for checking my accessibility, such as screen reader announcements, would be greatly appreciated.

Code

Please log in to post a comment

Community feedback

Alexis•30
@AlexisC73
Posted 5 months ago
This comment was deleted 5 months ago
Marzia Jalili•7,170
@MarziaJalili
Posted 5 months ago
Hi @skyv26,

The project's looking awesome!

Some tiny adjestment you can consider implementing:
- First, wouldn't it be better if the card had some margin at the top and bottom?
You can set the font-size and gap between elements to smaller numbers to get rid of scrolling after updating the web with this detail.
- Second, you can prevent the error boxes added by default.
Take the code below as an example to use the preventDefault() function which removes them:
```
btn.addEventListener("click", (event) => {
  event.preventDefault();
  // this ensuers that the boxes and other default styles 
  // will be removed
});
```
- In addition, when the user tries again to fill in the form it will be better if they were given cleaner layout. I mean without the error messages.
Use the onChange function with the inputs to have the feature set.

Other than this you're doing great!

Keep up the grind💪

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord