This script will give a form on a page (or multiple forms) the ability to send off an email once complete. Zero Javascript is required on the implementer’s part, and very minimal edits need to be made to the PHP. Basic validation can be enabled, and this form is resistant to spam bots since it works off AJAX (and thus Javascript, which most bots have disabled). All the different input fields should work (text box, checkbox, drop downs, text areas, password fields, etc) except for file uploads, which I’ll probably handle in a later post.
Example: here
Source: ajaxForm.php
Although the source file is a PHP file, it needs to be included in the HTML as if it were a Javascript as shown in the example.
Note that there are two variables which should be edited by the implementor, both of which are at the very top of the file: $to and $from. These (pretty self-explanitorily) variables are the email addresses which the email is sent to and from. Note that the $to field may contain several email addresses separated by commas. This should be the only edit to the PHP/Javascript code that needs to be made.
In your HTML, add the “ajaxForm” class to your form(s) which you want to use this script. Note that the Javascript will overwrite the “action” property of the form, but this shouldn’t be a concern in most cases.
Two hidden fields should be included, “ajaxFormSubject” and “ajaxFormCompleteDiv”. ajaxFormSubject is the subject which you wish the email to have. ajaxFormCompleteDiv is the id of the HTML element you wish to display (display: block) after the form is successfully complete, like a “thank you” div. Note that if you want the ajaxFormCompleteDiv to be hidden initially, you should hide it with your own CSS. This is for flexibility.
After successful form completion, the form element will automatically be hidden (display: none) and the ajaxFormCompleteDiv automatically shown (display: block).
To enable validation for a field, add the class “required” to the field. The validation only consists of checking if some value was entered.
If a field is found to be invalid, the input, select, or textarea will be given the class “ajaxFormError”. You should add your own CSS to determine the style of this.
This code is meant for designers or developers with little to no programming experience and satisfies this requirement quite nicely as only 2 PHP variables should be modified and the rest is in the HTML.