Hello everyone .. i'm back with a problem again
.. hopefully some of you intelligent lot will be able to help me again.
This time i need help in setting up a contact form. I have the html down and the css too, but the sendContact.php file i need help setting up .. so that when someone uses the form n submits it, it can send the details to my email.
Since i've been modifying a free template i got the files from it so they need tweaking and i am hoping someone can help me with the required code to make it work.
Heres how the sendContact.php looks like:
Code:
<?php
$from = "xxx@XXXXX.com";
$from_name = "XXX";
$subject = "Contact Form";
$to = $_POST['email'];
// collect data
$body = "";
foreach($_POST as $key => $val)
{
if($key != 'captcha')
$body .= ucfirst($key).": ".$val."\r\n";
}
// construct MIME PLAIN Email headers
$header = "MIME-Version: 1.0\n";
$header .= "Content-type: text/plain; charset=utf-8\n";
$header .= "From: $from_name <$from>\r\nReply-To: $from_name <$from>\r\nReturn-Path: <$from>\r\n";
// send email
$mail_sent = mail($to, $subject, $body, $header);
?>
Heres the relevant CSS code (putting it here incase it needs editing:
Code:
#left { width: 600px; float: left; margin-left: 25px; display: inline; }
#left img { float: left; margin: 5px 20px 2px 0; padding: 3px; border: 1px solid #ccc; }
#left form { padding-left: 45px; }
#left label { float: left; display: block; clear: both; padding: 3px 0; color: #666; font-weight: normal; width: 150px; }
#left .lcurrent { font-weight: bold; }
#left label img { vertical-align: middle; }
#left input.text, textarea, select { float: left; margin: 0 5px 10px 0; padding: 7px; width: 350px; border: 1px solid #ccc; }
#left textarea { height: 200px; }
#left select { width: 366px; }
#left input.radio { }
#left input:focus { border-color:#aaa; }
#left textarea:focus { border-color: #aaa; }
.error { font-size: 10px; color: #666; margin: 0 0 10px 150px; display: none; }
#left .submit { border: 0; background: #000; color: #fff; padding: 5px; float: left; margin-left: 150px; }
ul { color: #666; margin: 0 0 10px 30px; line-height: 18px; }
ol { color: #666; margin: 5px 0 5px 30px; line-height: 18px; }
#contact-back { margin: 12px 40px 0 0; float: right; }
And heres the relevant HTML coding ...
Code:
<!-- main content -->
<div id="left">
<div id="contact_form">
<h1>Contact us</h1>
<p>Please use the form below to make your booking.</p>
<form method="post" onsubmit="return sendContact();" action="sendContact.php">
<p>
<label for="name" id="lname">Full name:</label>
<input type="text" class="text" name="name" id="name" onfocus="input_focus('name');" onblur="input_blur('name');" />
</p>
<p>
<label for="email" id="lemail">Email address:</label>
<input type="text" class="text" name="email" id="email" onfocus="input_focus('email');" onblur="input_blur('email');" />
</p>
<div class="x"></div>
<p class="error" id="email-error">You must enter your email address.</p>
<p>
<label for="category" id="lcategory">Subject:</label>
<select name="category" id="category" onfocus="input_focus('category');" onblur="input_blur('category');">
<option value="booking">Booking</option>
<option value="query">Query</option>
<option value="consulting">Consulting</option>
<option value="resources">Resources</option>
</select>
</p>
<p>
<label for="message" id="lmessage">Message:</label>
<textarea name="message" id="message" onfocus="input_focus('message');" onblur="input_blur('message');"></textarea>
</p>
<div class="x"></div>
<p class="error" id="message-error">Enter the details of your booking.</p>
<p>
<label for="captcha" id="lcaptcha"></label>
<input type="text" class="text" name="captcha" id="captcha" onfocus="input_focus('captcha');" onblur="input_blur('captcha');" />
</p>
<div class="x"></div>
<p class="error" id="captcha-error">Are you sure about your calculations?</p>
<script type="text/javascript">
generate_captcha('lcaptcha');
</script>
<div class="x"></div>
<input type="submit" class="submit" name="send_contact" value="Send" />
</form>
<span id="contact-back">or you can <a href="index.html" class="read-more">Go back</a></span>
</div>
<div id="message_sent" style="display:none;">
<h1>Your booking details have been sent</h1>
<p>We'll contact you in a shortest possible time.</p>
<p>You can now <a href="index.html" class="read-more">go back</a> to home page.</p>
</div>
</div>
Any help with this query will be hugely appreciated.
Before you post, read our: 
