Cat Owner Questionnaire 🐱

JavaScript Form

This JavaScript Form was created during the 2nd week of studying at ITGirlSchool, focusing on the study subject of "HTML5 form tags". It has since been upgraded during weeks 18 ("Form validation"), 19 ("OOP"), and 21 ("GET and POST requests").

Initially, I built a basic form with input fields, select, checkbox, radio buttons, and more to practice using HTML5 form tags.

In week 18, I improved the form by adding HTML5 form validation and autoformatting for text, phone, and email inputs. I also made the layout responsive and added the ability to load and preview pet photos.

During week 19, I upgraded the form by creating a Cat class with properties that correspond to the questionnaire data. I also created an instance of this class and stored it in Local Storage.

In week 21, I implemented a POST-request using FormData for form submission.

Demo

cat-owner-questionnaire

Tech stack

    ✓   HTML5
    ✓   CSS3
    ✓   JavaScript
    ✓   HTML5 form validation
    ✓   POST requests
    ✓   FormData()

Result

* Weeks 2, 18, 19 & 21 Training Project in ITGirlSchool