Intro component with form validation

Community feedback

• 

  

  Grace•32,130

  @grace-snow

  Posted about 3 years ago

  This is pretty good!

  Just a few pointers on html

  • you're misusing the section element at the moment. Sections act just like divs when used like this. They are only meaningful if they are labelled (and this challenge doesn't need that extra emphasis anyway). Looking at this content, it is all related and would only be one section. As a general rule, done even consider using a section unless there is a chunk of content clearly defined and headed by a h2.
  • inputs need labelling. Essential
  • error images need to have empty alt attributes. Ideally they wouldn't be in the html at all, but background images instead
  • the error message elements should be blank by default and linked to each input. You do this via a unique id on each error message, and aria describedby on each input. The error messages also need an aria live attribute on them so they are announced by screenreaders when they become visible
  • never have text in divs or spans alone. Always use a meaningful element, like a paragraph

  00
• 

  Josh•110

  @JoshMooner

  Posted about 3 years ago

  Hi, Mostafa! It's look prety well. Nice job, I can note that you add an input of password confirm and I think it's great if it's a page to login. I'm doing this challenge too but I don't know how to hide and show the error messages. I did the form validation with alerts and everything is OK, but in the moment of show and hide the warning messages I don't know how to do it. I thought on use position: absolute with z-index: -1 to hide and position: static with z-index: 0 to show. But when I submit the form to valid it, the page structure damage. My knowledge of JS is basic. How do you did it? Any help, please? Thanks!

  02