Forms.

Form formatting & validation

My two main objectives with the MVP version of this form were to add form validation and to make the phone number field more usable.

Form validation is no joke. First I boosted my input tags with attributes (Constraint Validation), using what was readily available to me via HTML5 & most browsers. Then, thinking that there must be many elegant existing supplemental solutions for form validation, I did some additional research and found a script that would allow my entire form to require validation before being submitted.

My goal for this form eventually is for it to be even more user-friendly. I started with the phone number field. I read that just having a placeholder with the desired format isn’t enough and often goes ignored by users. So I found a plugin for input masking that would do the work for them. This mask really only works for people with US numbers, so a “nice to have” would be to add functionality for country number recognition that would adjust masking accordingly.

Another “nice to have” that I believe would add to the user experience would be address recognition and autofill.

I think my most valuable experience from this stint was figuring out how to implement full sets of code written by someone else. Trying to understand another person’s documentation I think will only help me create better documentation and help me continue to learn how to code.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store