Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive signup form with JavaScript form validation

Christinaโ€ข 90

@teenabobeena

Desktop design screenshot for the Intro component with sign-up form coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi, thank you for taking the time to check out my project! This is my first attempt at semantic HTML so please leave any feedback on my approach. Also:

  1. how can I add the error icon to an invalid input?
  2. how can I check the email for the correct format?

All comments appreciated

Community feedback

Tushar Biswasโ€ข 4,080

@itush

Posted

Congratulations on completing the challenge! ๐ŸŽ‰

  • In my solution for this challenge I first linked the error-icon for every input field and then toggle the opacity using JS.

  • To validate correct format of email you may use JS client-side-validation using RegExp. Here is an example:

function validateEmail(email) 
{
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email.value))
{
return (true)
}
alert("You have entered an invalid email address!")
return (false)
}

You may checkout my project code here

I hope this helps. And I look forward to see cool projects from you in the future๐Ÿš€

Keep at it...๐Ÿ’ป Happy hacking!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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