PHP Contact Form and Form Validation in Dreamweaver
PHP Contact Form and Form Validator - Discussion
Check out a completed Contact Form here: Contact Form.
I originally started work on this Contact Form and Form Validation tutorial in Dreamweaver CS5 way back in October of last year but alas, I had to abandon the project due to existing work commitments and because I took on way too much freelance work. But every now and then I would open up the web form and contact form script and try to find ways to improve the web form and find out how best to deliver a PHP contact form in a concise Dreamweaver tutorial that even a beginner would be able to follow. I think I cracked it.
What I ended up producing was a two part Dreamweaver CS5 video tutorial which not only explains tentatively how to build a contemporary and professional email contact form, but also shows how to process the php contact form and take the message from form to email.
But that wasn’t all that was focused upon in this Dreamweaver CS5 contact form tutorial. I wanted to go beyond the form mail process.I wanted to give a total beginner the ability to connect an advanced form validation system to their email contact form.
I wanted to give a total beginner the ability to connect an advanced form validation system to their email contact form.
A form validation script that would protect the php contact form from email injection and help to keep the recipients email address as free from spam as a form validation system would allow.
I decided to split the tutorial into two parts. The first part of the Dreamweaver CS5 email contact form tutorial would concentrate on the design and structure of the contact form. The web form needed to be styled in a progressive and modern fashion and also properly prepared so that a beginner could easy attach the necessary form to email contact form scripts which would process the web form and send the message to the email address specified on the contact form. The contact form also needed to be designed to take a snazzy and modern moo tools instant client side form validation script.
I wanted to go even further than just creating a contact form tutorial using two types of form validation. So once the contact form does pass the contact form validation process and the message is sent to the recipient, a thank you message appears to the person who submits the form. This message can be programmed to contain anything from a simple thank you, an image and a message or an invitation of some kind.
The email contact form can redirect to a sales page or even your homepage. You could also just redirect the formmail page back to the PHP contact form and let the user navigate away from the web form themselves.
The last step in this Dreamweaver CS5 PHP contact form tutorial is to add the finishing touches to the styling of our email contact form. We move away from inserting the contact form script, the form validation and the web form redirect that is placed after the user submits the form, and back to the contact form input areas where we shall add pseudo selectors to add a hover effect for when someone clicks inside of each contact form input. We start by changing the color of the contact form inputs from white to a light grey color; although once you learn how to style the form inputs, you can change the forms inputs to whatever you want them to be.
We then add a CSS Pseudo selectors which will change the color back to whatever you choose only when someone clicks inside of the form input area. This adds a nice styling touch to our email contact from and give the web form filler some useful feedback as to the position of their cursor.