DEV Community

Discussion on: My Student Form JS Validation Project

Collapse
 
tqbit profile image
tq-bit • Edited

Hi Mahilan,

I've taken some time to go through your form. Here's a few things I noticed:

  1. I think you did the form validation pretty good in general
  2. I especially liked the way to dynamically set the select input of the city, depending on what state a user selects.
  3. There are a few form practices you should memorize though:
    • Use labels for each input and aria-describedby to highlight the element that describes the error
    • In general, it's a good idea to consider accessibility when dealing with forms. developer.mozilla.org/en-US/docs/W...
  4. I also noticed a few practices about your HTML you could improve:
    • Avoid using , if possible. Also, avoid tables for positioning, Use CSS for either case.
    • Consider contrasting. Use white / grey'ish body backgrounds rather than bright ones such as aquamarin
  5. About your JS, you might want to consider wrapping everything inside an anonymous function. In here, you can assign document.forms[formname] once and reuse the variable

I've gone ahead and made some other (opinionated) changes to your codepen. I haven't gone all the way with the dynamic listing, but perhaps it helps.

Here's the link: codepen.io/EarthenLynx/pen/QWqGGqZ

Happy coding