UPDATED 2/23/2010

Here I am, over a year later, shaking my head at my bulky code. Here is the updated, much more lightweight, drop-in AJAX contact form. It now uses JQuery, the JQuery Forms Plugin, and the JQuery Validation Plugin instead of Scriptaculous and WForms. The page loads much faster than before, and the source is about 1/3rd of the size.

Installation instructions: Unzip to your directory, modify the two variables in “config.php” to your liking, and you should be up and running right away! Feel free to use and modify however you like. Just add the class = “required” tag to any fields that you want to make sure are filled out before submitting the form. More advanced validation options can be found at http://docs.jquery.com/Plugins/Validation. If you happen to throw me a comment here showing it in action, I’d be happy to link to your site in this post!

Download (ver 1.6): whs_ajax_contact_form_1.6.zip (39.7KB)
Download (ver 1.5): whs_ajax_contact_form_1.5.zip (34.4KB)
CHANGELOG:
1.6: Updated to JQuery 1.4
Fixed several issues with validation and submission
1.5: Reworked with JQuery
1.01: Fixed a php tag.

View the form in action at http://www.whathuhstudios.com/contact.php.

History (depreciated):

Download (ver 1.01): whs_ajax_contact_form_1.01.zip (93.2KB)

More information for developers:

I did some searching online for a quick and easy AJAX contact form… There isn’t one. The free ones are two years old and don’t work, and the other ones I saw cost money. So I fixed the problem.

This is a pretty basic form that uses Scriptalicious Scriptaculous(already included), and WForms (also already included). Scriptalicious is in there for some of the fancy dynamic effects. They aren’t over the top in any way, but just a little bit to class it up. The WForms has a validation routine that makes sure required fields are filled out. I left it in there so that you can ad fields to your liking. Just add the class = “required” tag to any fields that you want to make sure are filled out before submitting the form.

Credit for (version 1.01) codebase: http://www.jeffpipas.com/

Tags: ajax, Design, downloads, php, tips