6.5 Contact Form
Tip: HTML-contactform.tpl.php
Before we begin, you will probably want to look at the bundled template for the Contact Form. You can see how the template includes a file which contains both the functionality PHP and the form itself. You may copy the template and modify it.
It is likely you will create a Contact Form, typically as a template file named "HTML-contact.tpl.php". The contact form must include a “functionality file” - this is a seperate file that is able to process the information that the user provides to the web page. You will need to include /templateincludes/contact_form_functionality.inc.php in your templates.
<?php
include "templateincludes/contact_form_functionality.inc.php";
?>
However It is suggested that you copy the standard functionality include from /templateincludes/ to your new template family, and use this.
cp /templateincludes/contact_form_functionality.inc.php /templates/mytribiqsite/newtemplatefamily/includes/
We can then include this file instead of the /templateincludes file.
<?php
include $template_path."/includes/contact_form_functionality.inc.php";
?>
A Contact Form Page can be created through the CMS (as a HTML Content Item) once this template file has been installed through the admin panel.
If a Form is successfuly submitted, it will return the variable $confirmation. Therefore, in order to display a form to our visitors, we can simply check whether this variable has been checked.
<?php if (!$confirmation) { ?>
We can then setup our form. You should use the following opening form tag:
<form id="contact" action="<?php echo $_SERVER['HOST'] . "?" . $_SERVER['QUERY_STRING'];?>" method="post" errorlist="inputerrorlist" onsubmit="return validateForm(this);">
Within the form, you should create a div to hold any error messages. These are automatically generated by the CMS:
<div id="inputerrorlist" class="inputerrorlist" <?php if ($errordisplay|$errormessage) { echo "style=\"visibility: visible;\""; };?>>
<?php echo $errordisplay;?>
<?php echo $errormessage;?>
</div>
6.5.1 Creating New Fields
To add a form field such as text input, select menus or radio buttons, please use the following structure:
<label for="name">Your Name:</label>
<input
class="someclass"
type="text"
name="name"
id="name"
required="true"
csserrorclass="input_text_error"
errmsg="You must enter your Name"
value="<?php if ($_POST["name"]){echo htmlspecialchars(str_replace('\\', '',$_POST["name"]), ENT_QUOTES);}?>"
<?php if($error['name']) { echo "class=\"input_text_error\"";};?> />
You should create a label for each of your inputs. Each input (and select,radio,checkboxes etc) can have CSS styles applied to it. The input name is use to create the parameter that is passed to the functionality pages. The value of the input should take into account the current value of the field if there is an error.
You can create new fields to be processed by creating an input in the template, and then grabbing this value in the functionality include. You need to give input elements a HTML “name” e.g
<input type="text" name="MY_FIELD" ...... >
You must then reference this in the contact_form_functionality include so that the value is included in the email (PHP):
$message .= "Field Title: " .
htmlspecialchars(str_replace('\\', '',$_POST['MY_FIELD']), ENT_NOQUOTES) . "
\n";
See Appendix C for a breakdown of a contact form input field.
6.5.2 Error Handling
In TribiqCMS, Error Handling is supported both client and server side. You can use Javascript to verify and validate a form before it is processed, saving a page refresh. You can use our custom HTML attributes to control the error messages.
required="true"
csserrorclass="input_text_error"
errmsg="You must enter your Name"
These parameters will control the Javascript, pre-processing Error handling. You can check if a form field has been used and provide an error if not. Otherwise, you can use PHP to validate your content.
If you want PHP to check for errors, then you edit use the functionality include. You will want to do your validation or verification on the POST or GET parameter that contains the data you wish to check. You should then store any error message in the $error array, using the name of the POST or GET parameter as the key.
In the following example we will check to see if the parameter "email" , which is associated with an input of the same 'name' attribute, is valid. If it is not, we will put the error message "You must enter a valid Email address" into the error array at the "email" key.
if(!eregi('^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$',$_POST['email'])) {
$error['email'] = "You must enter a valid Email address";
}
Now if we look back to our form, we can see that all PHP processed error messages will be displayed in the div created at the top of the form. You can also highlight a specific form field that has an error, by applying a CSS class to it when an error exists for that form. Put this attribute into your <input> tag:
<?php if($error['name']) { echo "class=\"input_text_error\"";};?>
6.5.2 Handling Confirmation
After your form, we should now cover the other case - if the user has submitted it. If successful, we can echo the Confirmation message.
<?php } else {
echo $confirmation;
} ?>
6.5.3 Captcha
You can enable your Contact Form to use the anti-spam Captcha plugin. To use Captcha, the Site Setting (Admin Control Panel) contactform_use_captcha must be set to True / 1.
We can then check for this:
<?php if($useCaptcha == "1") { ?>
If it is true, you should construct a new fieldset (within the same <form> that the rest of the Contact Form is in) that contains the capture image and a text input for the visitor to enter the digits/characters. The captcha functionality file is located at /templateincludes/captcha/getImg.php
You can use the following snippet:
<fieldset>
<legend>Verification</legend>
<label>Picture:</label>
<img style="margin-left:5px;" src="templateincludes/captcha/getImg.php" alt="Registration Verification Code" border="1">
<label for="verify_code">Characters:</label>
<input class="inputText" type="text" name="verify_code" id="verify_code" value="" required="true" csserrorclass="input_text_error" errmsg="You need to enter the code shown to verify your registration." autocomplete="off" <?php if($error['verify_code']) { echo "class=\"input_text_error\"";};?>>
</fieldset>
Top of Page