Skip to content
Submitted about 1 year ago

Check the validation of the input and assign a state to the button

duongns-vn•210
@duongns-vn
A solution to the Newsletter sign-up form with success message challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?
  • Check the validation of the email when the user enters it. email.addEventListener('input', updateButtonState)
  • Update submit button status and color based on email validity. function updateButtonState()
  • Show or hide error messages depending on email validity.
  • Change the color of the submit button when hovering in or out if the email is valid. onmouseover onmouseleave
  • Display success notification and email value when the user presses the submit button and the email is valid. addEventListener('click', function)
Code

Please log in to post a comment

Log in

Community feedback

  • N1Dovud•150
    @N1Dovud

    Hi, there! Great project! I liked it. As for feedback, if you pay attention to the text input field, when I click it, its border color becomes yellow, whereas according to the design, it needs to be black or smth close to that. Another thing I noticed is your website is not responsive, it only works for desktop but not for tablets or mobile devices. Do consider this and if you need some help, you can check out my solution. I hope I was of some help. Have a good day!

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