I am attempting to have a bootstrap contact form fade out on submit.
I am working with code I have found (which I've slightly modified to suit my needs), and I am having trouble with its implementation. I'm fairly new and I seem to have gotten quite stuck.
Here is the JS:
$('contactUs').on('submit', function mailMe(form) {
form.preventDefault(); //Prevents default submit
var form = $(this);
var post_url = form.attr('action');
var post_data = form.serialize(); //Serialized the form data for process.php
$('#loader', form).html('<img src="http://domain.com/test/images/loading.gif" /> Please Wait...');
$.ajax({
type: 'POST',
url: 'http://domain.com/test/process.php', // Your form script
data: post_data,
success: function(msg) {
$(form).fadeOut(500, function(){
form.html(msg).fadeIn();
});
}
});
});
Here is the Form:
<form name="contactUs" onSubmit="return mailMe(this.form)" >
<div class="inputWrap">
<div class="fname">
<input class="myInput miLeft" type="text" placeholder="Name">
</div>
<div class="femail">
<input class="myInput miRight" type="text" placeholder="Email">
</div>
</div>
<div class="taWrap">
<textarea class="myTa" type="text" placeholder="Message"></textarea>
</div>
<button class="btns btn-3 btn-3g btnsx">Send</button>
</form>
And here is the process.php:
<?php
/* Configuration */
$subject = 'New Customer Email'; // Set email subject line here
$mailto = 'myemail#me.com'; // Email address to send form submission to
/* END Configuration */
$name = $_POST['name'];
$email = $_POST['email'];
$messageContent = $_POST['messageContent'];
$timestamp = date("F jS Y, h:iA.", time());
// HTML for email to send submission details
$body = "
<br>
<p>The following information was submitted through the contact form on your website:</p>
<p><b>Name</b>: $name<br>
<b>Email</b>: $email<br>
<b>Message</b>: $messageContent<br>
<p>This form was submitted on <b>$timestamp</b></p>
";
// Success Message
$success = "
<div class=\"row-fluid\">
<div class=\"span12\">
<h3>Submission successful</h3>
<p>Thank you for taking the time to contact Shaz Construction & Design. A representative will be in contact with you shortly. If you need immediate assistance or would like to speak to someone now, please feel free to contact us directly at <strong>(415) 382-8442</strong>.</p>
</div>
</div>
";
$headers = "From: $name <$email> \r\n";
$headers .= "Reply-To: $email \r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$message = "<html><body>$body</body></html>";
if (mail($mailto, $subject, $message, $headers)) {
echo "$success"; // success
} else {
echo 'Form submission failed. Please try again...'; // failure
}
?>
There are a few small things you are missing:
Your jQuery selector for the form is incorrect - give your form an ID attribute of contactUs, and then use the selector $('form#contactUs'). Get rid of the name attribute on the form.
Your button element needs to be of type submit - your button currently does nothing.
You don't need the onSubmit attribute, you are already binding your form to an event in the JS.
Your input tags currently do not have any name elements on them - they are required - see http://api.jquery.com/serialize/
You try to access an attribute on the form that does not exist (action), but you don't use it, so just remove that line.
Use return false rather than preventDefault in your event handler (I couldn't get preventDefault to work. That might just be me though!)
I can't tell this because of the context of your code, but ensure that your JS is within a $('document').ready(function() { ... } block.
I think that your JS and HTML should be:
JS
$('form#contactUs').on('submit', function() {
var form = $(this);
var post_data = form.serialize(); //Serialized the form data for process.php
$('#loader').html('<img src="http://yasharsahaleh.com/test/images/loading.gif" /> Please Wait...');
$.ajax({
type: 'POST',
url: 'http://yasharsahaleh.com/test/process.php', // Your form script
data: post_data,
success: function(msg) {
$('#loader').html('');
// We know this is the form that needs fading in/out
$('form#contactUs').fadeOut(500, function(){
$('form#contactUs').html(msg).fadeIn();
});
}
});
return false;
});
HTML
<form id="contactUs">
<div class="inputWrap">
<div class="fname">
<input name="name" class="myInput miLeft" type="text" placeholder="Name">
</div>
<div class="femail">
<input name="email" class="myInput miRight" type="text" placeholder="Email">
</div>
</div>
<div class="taWrap">
<textarea name="messageContent" class="myTa" type="text" placeholder="Message"></textarea>
</div>
<button type="submit" class="btns btn-3 btn-3g btnsx">Send</button>
</form>
I made a small JSFiddle to illustrate most of this (taking out the AJAX part): http://jsfiddle.net/dualspiral/2rXas/1/
The PHP needs changing slightly, you are not actually printing out the variable contents. The body variable shoud actually be assigned:
$body = "
<br>
<p>The following information was submitted through the contact form on your website:</p>
<p><b>Name</b>: " . $name . "<br>
<b>Email</b>: " . $email . "<br>
<b>Message</b>: " . $messageContent . "<br>
<p>This form was submitted on <b>" . $timestamp . "</b></p>
";
and the last lines should read:
$headers = "From: " . $name . " <" . $email . "> \r\n";
$headers .= "Reply-To: " . $email . " \r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$message = "<html><body>" . $body . "</body></html>";
if (mail($mailto, $subject, $message, $headers)) {
echo $success; // success
} else {
echo 'Form submission failed. Please try again...'; // failure
}
?>
Related
I have Html website. There is newsletter signup form in the html. It is processed by php script file for sending the email. After the form submission I want it back to the original page and also an alert message for "Thank you for newsletter signup"
HTML :
<div class="col-xs-12 col-sm-12 col-md-6 newsletter-form">
<form name="contactform" method="post" action="scripts/contact.php" onsubmit="return ValidateForm(contactform)">
<input type="text" name="stremail" placeholder="Your email address" ><input type="submit" value="Submit">
</form>
</div>
Javascript Validation :
function ValidateForm(Form)
{
if (Form.stremail.value == "") {
alert("Please enter \"Email\" ");
Form.stremail.focus();
return (false);
}
if ((/^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(Form.stremail.value)) == false) {
alert("Invalid E-mail Address! Please re-enter.");
Form.stremail.focus();
return (false);
}
return (true);
}
PHP Script :
$stremail = $_POST["stremail"];
$to = "thebrandtgroupre#gmail.com";
$from = $stremail;
$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
$headers. = "From: \"$from\" <$from>\r\nReply-To: \"$from\" <$from>\r\nX-Mailer: PHP/".phpversion();
$headers. = "BCC: luxuryproperties#gmail.com,pnparamasivan#gmail.com".
"\r\n"; //for testing purpose
$subject = "The Brandt Group Newsletter Signup";
$message = "Dear Administrator,\r\n\n";
$message = $message.
"The following information was submitted to the website:<br/><br/>";
$message = $message.
"Email Address : ".$stremail.
"<br/><br/>";
mail($to, $subject, $message, $headers);
header("Location: {$_SERVER["
HTTP_REFERER "]}");
$message2 = "Thank you for newsletter signup";
echo "<script type='text/javascript'>alert('Thank you for newsletter signup');</script>";
Any help ?
If you are using Jquery you can do like this:
HTML side
<div class="col-xs-12 col-sm-12 col-md-6 newsletter-form">
<form name="contactform" method="post">
<input type="text" class="stremail" name="stremail" placeholder="Your email address" >
<input type="submit" value="Submit">
</form>
</div>
The form action and onsubmit attributs have been removed
A class has been added on stremail input
Javascript
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(function(){
var form = $('form ');
form.submit(function(e) {
e.preventDefault();
if(ValidateForm(Form)) {
var data = {
'stremail' : $('.stremail').val()
}
$.post("scripts/contact.php", data, function(response) {
if(response.success) {
alert(response.success);
}
else {
// YOUR LOGIC WHEN ERROR OCCURED
}
});
}
});
function ValidateForm(Form) {
if (Form.stremail.value == "") {
alert("Please enter \"Email\" ");
Form.stremail.focus();
return(false);
}
if ((/^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(Form.stremail.value)) == false) {
alert("Invalid E-mail Address! Please re-enter.");
Form.stremail.focus();
return (false);
}
return(true);
}
});
</script>
PHP Side
Verify $_POST data and return response by type
<?php
$response = [];
if(isset($_POST["stremail"]) && !empty($_POST["stremail"])) {
$stremail = $_POST["stremail"];
$to="thebrandtgroupre#gmail.com";
$from = $stremail;
$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .="From: \"$from\" <$from>\r\nReply-To: \"$from\" <$from>\r\nX-Mailer: PHP/".phpversion();
$headers .="BCC: luxuryproperties#gmail.com,pnparamasivan#gmail.com" . "\r\n";//for testing purpose
$subject = "The Brandt Group Newsletter Signup";
$message = "Dear Administrator,\r\n\n";
$message = $message ."The following information was submitted to the website:<br/><br/>";
$message = $message ."Email Address : ".$stremail."<br/><br/>";
mail($to,$subject,$message,$headers);
$response['success'] = "Thank you for newsletter signup";
}
else {
$response['error'] = "YOUR_ERROR_MESSAGE";
}
return $response;
?>
The alert will not happen because you have already called header to redirect the user. To accomplish your goal of a javascript popup I'd perhaps set a session variable after the email has been sent and then when you are redirected back to the signup page, assuming that it is a PHP enabled page, you can test for that session and perform the javascript alert.
<?php
/* mail handler */
session_start();
$stremail = $_POST["stremail"];
$to="thebrandtgroupre#gmail.com";
$from = $stremail;
$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
$headers .= "From: \"$from\" <$from>\r\nReply-To: \"$from\" <$from>\r\nX-Mailer: PHP/".phpversion();
$headers .= "BCC: luxuryproperties#gmail.com,pnparamasivan#gmail.com\r\n";
$subject = "The Brandt Group Newsletter Signup";
$message = "
Dear Administrator,
The following information was submitted to the website:
<br/><br/>
Email Address: {$stremail}
<br /><br />";
mail( $to, $subject, $message, $headers );
header( "Location: {$_SERVER["HTTP_REFERER"]}");
$_SESSION['mail']=true;
$message = "Thank you for newsletter signup";
?>
The signup page
<?php
session_start();
?>
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<title>signup</title>
</head>
<body>
<div class="col-xs-12 col-sm-12 col-md-6 newsletter-form">
<form name="contactform" method="post" action="scripts/contact.php" onsubmit="return ValidateForm(this)">
<input type="text" name="stremail" placeholder="Your email address" />
<input type="submit" />
</form>
</div>
<?php
if( !empty( $_SESSION['mail'] ) && $_SESSION['mail']==true ){
printf('<script>alert("%s");</script>', $message );
unset( $_SESSION['mail'] );
}
?>
</body>
</html>
When i send an email with my contact form the textarea value does not send and the "message:" field is always empty in the email.
Declaring the input variables manually in jquery instead of using serialize gives the same result.
The textarea is inside the form tags so i have no idea why its value is not picked up and posted.
I've tried giving the textarea an id="message" and calling it manually in jquery like: var text = $("#message").val(); and var text = $("textarea#message").val(); but it still doesn't send.
I don't know what i'm doing wrong. Please help.
Here is my code:
<form id="contactForm" method="POST">
<div class="row small-margin">
<div class="col-md-4">
<i class="pe-7s-user pe-2x icon-contact"></i>
<input name="name" type="text" placeholder="Name(required)" required size="35">
</div>
<div class="col-md-4">
<i class="pe-7s-mail pe-2x icon-contact"></i>
<input name="email" type="email" placeholder="Email(required)" required size="35">
</div>
<div class="col-md-4">
<i class="pe-7s-link pe-2x icon-contact"></i>
<input name="website" type="text" placeholder="Website" size="35">
</div>
</div>
<div class="row small-margin">
<div class="col-md-12">
<!-- Message Field -->
<textarea name="message" placeholder="Your Message(required)" required></textarea>
<!-- Submit Button -->
<button id="submit" name="submit" type="submit" class="button" value="submit">SEND MESSAGE</button>
<!-- Success Message -->
<div id="msgSubmit" class="alert alert-success text-center hidden">Message Sent Successfully</div>
</div>
</div>
</form>
And JS:
$("#contactForm").submit(function(event){
// cancels the form submission
event.preventDefault();
console.log( $( this ).serialize() );
});
$.ajax({
type: "POST",
url: "php/form-process.php",
data: "name=" + name + "&email=" + email + "&website=" + website + "&message=" + text,
success : function(text){
if (text == "success"){
formSuccess();
}
}
});
}
function formSuccess(){
$( "#msgSubmit" ).removeClass( "hidden" );
}
And PHP:
<?php
// Set variables
$name = $_POST['name'];
$email = $_POST['email'];
$website = $_POST['website'];
$message = $_POST['text'];
$to = 'novakim92#gmail.com';
$subject = 'New Message from Nixo';
// Prepare email body text
$Body .= "Name: ";
$Body .= $name;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $email;
$Body .= "\n";
$Body .= "Website: ";
$Body .= $website;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $message;
$Body .= "\n";
// Send email
$success = mail($to, $subject, $Body, "From:".$email);
if ($success){
echo "success";
}else{
echo "<p>Something went wrong, please try again!</p>";
}
?>
I found the issue on your code:
the Values from textarea never made it the Server side, because you are doing this in your PHP:
$message = $_POST['text'];
You should do this in order to get the value from textarea:
$message = $_POST['message'];
This will solve your issue :). Hope it helps.
Your variable naming is inconsistent.
In your HTML-form you're using message for the name-attribute.
But in you're AJAX-call and in the PHP $_POST-GLOBAL you are looking for a variable called text.
When i send an email with my contact form the textarea value does not send and the "message:" field is always empty in the email.
Declaring the input variables manually in jquery instead of using serialize gives the same result.
The textarea is inside the form tags so i have no idea why its value is not picked up and posted.
I've tried giving the textarea an id="message" and calling it manually in jquery like: var text = $("#message").val(); and var text = $("textarea#message").val(); but it still doesn't send.
I don't know what i'm doing wrong. Please help.
Here is my code:
<form id="contactForm" method="POST">
<div class="row small-margin">
<div class="col-md-4">
<i class="pe-7s-user pe-2x icon-contact"></i>
<input name="name" type="text" placeholder="Name(required)" required size="35">
</div>
<div class="col-md-4">
<i class="pe-7s-mail pe-2x icon-contact"></i>
<input name="email" type="email" placeholder="Email(required)" required size="35">
</div>
<div class="col-md-4">
<i class="pe-7s-link pe-2x icon-contact"></i>
<input name="website" type="text" placeholder="Website" size="35">
</div>
</div>
<div class="row small-margin">
<div class="col-md-12">
<!-- Message Field -->
<textarea name="message" placeholder="Your Message(required)" required></textarea>
<!-- Submit Button -->
<button id="submit" name="submit" type="submit" class="button" value="submit">SEND MESSAGE</button>
<!-- Success Message -->
<div id="msgSubmit" class="alert alert-success text-center hidden">Message Sent Successfully</div>
</div>
</div>
</form>
And JS:
$("#contactForm").submit(function(event){
// cancels the form submission
event.preventDefault();
console.log( $( this ).serialize() );
});
$.ajax({
type: "POST",
url: "php/form-process.php",
data: "name=" + name + "&email=" + email + "&website=" + website + "&message=" + text,
success : function(text){
if (text == "success"){
formSuccess();
}
}
});
}
function formSuccess(){
$( "#msgSubmit" ).removeClass( "hidden" );
}
And PHP:
<?php
// Set variables
$name = $_POST['name'];
$email = $_POST['email'];
$website = $_POST['website'];
$message = $_POST['text'];
$to = 'novakim92#gmail.com';
$subject = 'New Message from Nixo';
// Prepare email body text
$Body .= "Name: ";
$Body .= $name;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $email;
$Body .= "\n";
$Body .= "Website: ";
$Body .= $website;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $message;
$Body .= "\n";
// Send email
$success = mail($to, $subject, $Body, "From:".$email);
if ($success){
echo "success";
}else{
echo "<p>Something went wrong, please try again!</p>";
}
?>
I found the issue on your code:
the Values from textarea never made it the Server side, because you are doing this in your PHP:
$message = $_POST['text'];
You should do this in order to get the value from textarea:
$message = $_POST['message'];
This will solve your issue :). Hope it helps.
Your variable naming is inconsistent.
In your HTML-form you're using message for the name-attribute.
But in you're AJAX-call and in the PHP $_POST-GLOBAL you are looking for a variable called text.
Very new html and website developer and unsure why my current contact box is not working. I'm hosting it my own website and when I do attempt to send I get a message sent response but the emails are never received.
I have't eliminated the email hosting being broken by using multiple email addresses to send and receive from but have been unable to get find the source of the problem.
See relevant code bellow
main.js
// Contact form
var form = $('#main-contact-form');
form.submit(function (event) {
event.preventDefault();
var form_status = $('<div class="form_status"></div>');
$.ajax({
url: $(this).attr('action'),
beforeSend: function () {
form.prepend(form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn());
}
}).done(function (data) {
form_status.html('<p class="text-success">Thank you for contact us. As early as possible we will contact you</p>').delay(3000).fadeOut();
});
});
sendemail.php
<?php
$name = #trim(stripslashes($_POST['name']));
$from = #trim(stripslashes($_POST['email']));
$subject = #trim(stripslashes($_POST['name']));
$message = #trim(stripslashes($_POST['message']));
$to = '\\myemailaddress//';
$headers = array();
$headers[] = "MIME-Version: 1.0";
$headers[] = "Content-type: text/plain; charset=iso-8859-1";
$headers[] = "From: {$name} <{$from}>";
$headers[] = "Reply-To: <{$from}>";
$headers[] = "Subject: {$subject}";
$headers[] = "X-Mailer: PHP/".phpversion();
mail($to, $subject, $message, $headers);
die;
index.html
<div class="col-md-8 col-sm-12">
<div class="contact-form bottom">
<h2>Send a message</h2>
<form id="main-contact-form" name="contact-form" method="post" action="sendemail.php">
<div class="form-group">
<input type="text" name="name" class="form-control" required="required" placeholder="Name">
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" required="required" placeholder="Email Id">
</div>
<div class="form-group">
<textarea name="message" id="message" required="required" class="form-control" rows="8" placeholder="Your text here"></textarea>
</div>
<div class="form-group">
<input type="submit" name="submit" class="btn btn-submit" value="Submit">
</div>
</form>
</div>
</div>
Thanks you in advance!
Next issue is you aren't sending any data with your ajax. Using $(formSelector).serialize() simplifies gathering the data
$.ajax({
url: $(this).attr('action'),
//serialize form data and include it with request
data: form.serialize(),
beforeSend: function () {
...
}
}).done(function (data) {
....
});
Currently if you did print_r($_POST); in your php you would see it is empty
After work from #charlietfl answer. Changing the type and url seemed to fix it.
Working code underneath :
main.js:
var form = $('#main-contact-form').serialize();
form.submit(function (event) {
event.preventDefault();
var form_status = $('<div class="form_status"></div>');
$.ajax({
url: $(this).attr('action'),
type: 'POST',
dataType: "json",
beforeSend: function () {
form.prepend(form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn());
}
}).done(function (data) {
form_status.html('<p class="text-success">' + data.message + '</p>').delay(3000).fadeOut();
});
});
and my .php
<?php
header('Content-type: ');
$status = array(
'type'=>'success',
'message'=>'Thank you for contact us. As early as possible we will contact you '
);
$name = #trim(stripslashes($_POST['name']));
$email = #trim(stripslashes($_POST['email']));
$subject = #trim(stripslashes($_POST['subject']));
$message = #trim(stripslashes($_POST['message']));
$email_from = $email;
$email_to = '\\myemail//';
$body = 'Name: ' . $name . "\n\n" . 'Email: ' . $email . "\n\n" . 'Subject: ' . $subject . "\n\n" . 'Message: ' . $message;
$success = #mail($email_to, $subject, $body, 'From: <'.$email_from.'>');
echo json_encode($status);
die;
I have a simple contact form I'm trying to implement but I'm getting an "incorrect function" error when I try to launch it. My code below is as follows, and when I click submit, it redirects to
http://mywebsite.com/contactme.php
but with the text "Incorrect function" and that's it. My debug on firefox shows the following error:
POST http://www.mywebsite.com/v/vspfiles/contactform/contactme.php [HTTP/1.1 405 Method Not Allowed 33ms]
13:54:52.368 The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range.
The character encoding of the page must be declared in the document or in the transfer protocol.
I am using volusion software if that helps. But I have no idea if the error is in my code or because my webhost won't allow the function. Can someone give me some insight? I have tried the "contactme.php" page with and without the doctype declared. My two files are below. I do not have an "error.htm" page.
contact.html:
<!DOCTYPE html>
<html>
<head>
<title>Contact</title>
</head>
<body >
<div id="contact-area">
<form method="post" action="/v/vspfiles/contactform/contactme.php">
<h3>Contact us</h3>
<label for="Name">Name:</label>
<input type="text" name="Name" id="Name" />
<label for="City">City:</label>
<input type="text" name="City" id="City" />
<label for="Email">Email:</label>
<input type="text" name="Email" id="Email" />
<label for="Message">Message:</label><br />
<textarea name="Message" rows="20" cols="20" id="Message"></textarea>
<input type="submit" name="submit" value="Submit" class="submit-button" />
</form>
<div style="clear: both;"></div>
</div>
</body>
</html>
contactme.php:
<?php
$EmailFrom = "email#gmail.com";
$EmailTo = "email#gmail.com";
$Subject = "contact form";
$Name = Trim(stripslashes($_POST['Name']));
$Tel = Trim(stripslashes($_POST['Tel']));
$Email = Trim(stripslashes($_POST['Email']));
$Message = Trim(stripslashes($_POST['Message']));
// validation
$validationOK=true;
if (!$validationOK) {
print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
exit;
}
// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "Tel: ";
$Body .= $Tel;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $Message;
$Body .= "\n";
// send email
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");
// informs user they submitted, redirects to homepage
if ($success){
alert("Thank you for your interest in our multiple sample processing system. A member of the Claremont Bio team will respond to you shortly.");
window.location.assign(location.hostname);
}
else{
print "<meta http-equiv=\"refresh\" content=\"0;URL=error.htm\">";
}
?>
alert("Thank you for your interest in our multiple sample processing system. A member of the Claremont Bio team will respond to you shortly.");
window.location.assign(location.hostname);
This is not valid php code, it is javascript. It definitely should not be in your php script.
As an alternative, in your if($success) condition you could redirect to a "success.php" page. For example:
if($success){
header("Location: http://www.mydomain.com/success.php");
}
An example of a contact.php page I use is as follows, note as per Jorge's comments, I make use of echoing the command...
<?php
// configuration
require("../includes/config.php");
// if form was submitted
if ($_SERVER["REQUEST_METHOD"] == "POST")
{
// submission is sanitised using the "query" function
$name = check_input($_POST["name"]);
$email = check_input($_POST["email"]);
$phone = check_input($_POST["phone"]);
$message = check_input($_POST["message"]);
$category = $_POST["category"];
switch($category)
{
// do some checking here
}
// insert user into db
// Success Message
$success = "
<div class=\"row-fluid\">
<div class=\"span11\">
<div class=\"alert alert-block alert-success\" id=\"thanks\">
<h4>Got it!</h4>
<br/>
<p>I'll be in touch within 24 hours. <strong> Promise.</strong></p>
<br/>
<p>In the meantime, why not check out my Facebook page...</p>
<br/>
www.facebook.com/myfacebooksite
</div>
</div>
</div>
";
$subject = 'New Website Message!';
$mailto = 'your#email.com';
// HTML for email to send submission details
$body = "
<br>
<p>The following information was submitted through the contact form on your website:</p>
<p><b>Name</b>: $name<br>
<b>Email</b>: $email<br>
<b>Phone</b>: $phone<br>
<b>Category</b>: $category<br>
<b>Message:</b>: $message<br>
";
$headers = "From: $name <$email> \r\n";
$headers .= "Reply-To: $email \r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
$mailtext = "<html><body>$body</body></html>";
if (mail($mailto, $subject, $mailtext, $headers)) {
echo "$success"; // success
}
else
{
echo 'Form submission failed. Please try again...'; // failure
}
}
else
{
// else render form
redirect("/index.html");
}
?>
edit:
my contact form page has the following js:
// do the mailing
$('#contact_form').on('submit', function(e) {
e.preventDefault(); //Prevents default submit
var form = $(this);
var post_url = form.attr('action');
var post_data = form.serialize();
$.ajax({
type: 'POST',
url: 'contact.php',
data: post_data,
success: function(msg) {
$(form).fadeOut(200, function(){
form.html(msg).fadeIn();
});
}
});
});
Hope that helps steer you...
So turns out this isn't my error, this is my webhost. Had to call them up and they told me they don't support PHP currently. so I'm off to rewrite this is javascript. I'll give the answer to Jason as his was the most technically correct and pointed out the error. Thanks guys.