Im having a problem with the submit feature on a ajax contact form, I have the error part down, but cannot get it to submit the form when filled out and show the confirmation below the form.
html form
HTML Code:
<div id="form">
<form>
<table width="400" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="brd">
<div class="mg">
<p align="center">Enter your message below:</p>
<br />
<table width="400" border="0" align="center" cellpadding="4" cellspacing="0">
<tr>
<td><label>Full Name:</label></td>
<td><input type="text" id="name" size="30" /></td>
</tr>
<tr>
<td><label>Your Email:</label></td>
<td><input type="text" id="email" size="30" /></td>
</tr>
<tr>
<td><label>Your Subject:</label></td>
<td><input type="text" id="subject" size="30" /></td>
</tr>
<tr>
<td valign="top"><label>Your Message:</label></td>
<td><textarea name="body" rows="4" id="bodymsg"></textarea></td>
</tr>
<tr align="center">
<td colspan="2"><input type="button" value="Submit" id="submit" onClick="return check_values();"></td>
</table>
</div>
</td>
</tr>
</table>
</form>
<div id="confirmation" style="display:none" align="center"></div>
AJAX JS
Code:
var http = createRequestObject();
var areal = Math.random() + "";
var real = areal.substring(2,6);
function createRequestObject() {
var xmlhttp;
try { xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); }
catch(e) {
try { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
catch(f) { xmlhttp=null; }
}
if(!xmlhttp&&typeof XMLHttpRequest!="undefined") {
xmlhttp=new XMLHttpRequest();
}
return xmlhttp;
}
function sendRequest() {
var rnd = Math.random();
var name = escape(document.getElementById("name").value);
var email = escape(document.getElementById("email").value);
var subject = escape(document.getElementById("subject").value);
var body = escape(document.getElementById("body").value);
try{
http.open('POST', 'pform.php');
http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.onreadystatechange = handleResponse;
http.send('name='+name+'&email='+email+'&subject='+subject+'&body='+body+'&rnd='+rnd);
}
catch(e){}
finally{}
}
function check_values() {
var valid = '';
var name = document.getElementById("name").value;
var email = document.getElementById("email").value;
var subject = document.getElementById("subject").value;
var body = document.getElementById("body").value;
if(trim(name) == "" ||
trim(email) == "" ||
trim(subject) == "" ||
trim(body) == "") {
alert("Please complete all fields");
} else {
if(isEmail(email)) {
document.getElementById("submit").disabled=true;
document.getElementById("submit").value='Please Wait..';
sendRequest();
} else {
alert("Email appears to be invalid.nPlease check.");
document.getElementById("email").focus();
document.getElementById("email").select();
}
}
}
function handleResponse() {
try{
if((http.readyState == 4)&&(http.status == 200)){
var response = http.responseText;
document.getElementById("confirmation").innerHTML = response;
document.getElementById("confirmation").style.display ="";
}
}
catch(e){}
finally{}
}
function isUndefined(a) {
return typeof a == 'undefined';
}
function trim(a) {
return a.replace(/^s*(S*(s+S+)*)s*$/, "$1");
}
function isEmail(a) {
return (a.indexOf(".") > 0) && (a.indexOf("@") > 0);
}
PHP Code
PHP Code:
<?php
error_reporting(0); include 'cform_config.php';
if(!isset($rnd) || !isset($name) || !isset($email) || !isset($subject) || !isset($body)) { echo $error_message; die(); }
$email_from = $email; $email_subject = "Contact Form: ".stripslashes($subject); $email_message = "Please find below a message submitted by '".stripslashes($name); $email_message .="' on ".date("d/m/Y")." at ".date("H:i")."\n\n"; $email_message .= stripslashes($body);
$headers = 'From: '.$email_from."\r\n" . 'Reply-To: '.$email_from."\r\n" . 'X-Mailer: PHP/' . phpversion();
// mail($email_it_to, $email_subject, $email_message, $headers);
echo "<b>$confirmation</b>"; die(); ?>
|