Lab exercise 5: Contact form
Hidden sidebar header
Solution
Find the solution to this exercise here:
Related links
W3C Validator: validation tool:
aXe DevTools: accessibility validation tool:
MDN Web Docs: HTML source:
Google: we all use it:
Hidden header
Goals of the exercise
The goals of the exercise are the following:
- Understanding and working with Apache, MySQL and PHP.
- Learning to add and edit PHP code in an existing HTML and CSS webproject.
- Correct usage of forms and controls in HTML while also sending the submitted data to database.
- Understanding the innate security risks when handling submitted form data.
Reflection
Easy
I had no issues adding an extra field to the submit form. Adding it to the database and retrieving it on the messages page is fairly straightforward aswell. Adding a new column in pHpMyAdmin was easy.
Hard
I spent a significant amount of time on getting the checkboxes to work in my portfolio. First I had to add the checkbox; then make sure that it is seen as a string and not an array. After that I had an issue where I get an error code after trying to submit a form with 0 checkboxes ticked. I tried to add a second hidden checkbox with a value of 0 but that had its own slew of issue. I did manage to fix the issue with PHPcode and then styled the thank you and messages page. Should be working alright now.
Unsure
I had some issues getting the CSS to work when I copied the form from the working environment (htdocs in xampp) to a live version. I believe I managed to fix it though.