I am very new to PHP, so please bear with me here.
It seems like the form goes through, I don't get any errors, but I never receive an email.
Thank you in advance!!
Here is my html
<form class="form-horizontal" role="form" method="POST" id="contact-form" action="contact-form/form.php" style="padding-bottom: 5em;">
<div class="form-group">
<label class="sr-only" for="name">Name</label>
<div class="col-md-12">
<input type="text" class="form-control" name="name" id="name" placeholder="Enter Name">
</div>
</div>
<br>
<div class="form-group">
<label class="sr-only" for="email">Email</label>
<div class="col-md-12">
<input type="email" class="form-control" name="email" id="email" placeholder="Enter Email">
</div>
</div>
<br>
<div class="form-group">
<label class="sr-only" for="message">Message</label>
<div class="col-md-12">
<textarea class="form-control" name="message" rows="10"></textarea>
</div>
</div>
<br>
<div class="form-actions">
<input type="hidden" name="save" value="contact">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
Here is my php
<?php
// check for form submission - if it doesn't exist then send back to contact form
if (!isset($_POST["save"]) || $_POST["save"] != "contact") {
header("Location: ../index.php"); exit;
}
// get the posted data
$name = $_POST["name"];
$email_address = $_POST["email"];
$message = $_POST["message"];
$headers = 'From: '.$email_address."\r\n" .
'X-Mailer: PHP/' . phpversion();
// write the email content
$email_content = "Name: $name\n";
$email_content .= "Email Address: $email_address\n";
$email_content .= "Message:\n\n$message";
// send the email
mail ("myEmail", "Someone Wants a Website!", $email_content, $headers);
$to = $_POST['email'];
$subject = 'Thank you for contacting me!';
$msg = 'I have recieved your correspondence and will get back to you as soon as I can. Best regards, Mike Wilcox Designs';
mail($to, $subject, $msg);
header("Location: ../index.php"); exit;
?>
I am also using jquery validate
<script>
$(document).ready(function () {
$('#contact-form').validate({
rules: {
name: {
minlength: 2,
required: true
},
email: {
required: true,
email: true
},
message: {
minlength: 2,
required: true
}
},
highlight: function (element) {
$(element).closest('.control-group').removeClass('success').addClass('error');
},
success: function (element) {
element.text('OK!').addClass('valid')
.closest('.control-group').removeClass('error').addClass('success');
}
});
});
</script>
Related
I have created the contact form using HTML and PHP. Also, the mail is coming correctly to mail id. But after the success message, it is redirecting to the form.php page can someone please help me. It is my first time trying to build a website.
Here is my code for contact form:
<form method="post" action="form.php">
<input name="name" required="required" placeholder="Your Name">
<input name="email" type="email" required="required" placeholder="Your Email">
<div class="clearfix"> </div>
<textarea name="message" cols="20" rows="5" required="required" placeholder="Message"></textarea>
<div class="submit">
<input id="submit" name="submit" type="submit" value="Submit">
</div>
</form>
here is my form.php :
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: agriindiaexp.com';
$to = 'shridhar.kagi#gmail.com';
$subject = 'Email Inquiry';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
if ($_POST['submit']) {
if (mail ($to, $subject, $body, $from)) {
$success = "Message successfully sent";
} else {
$success = "Message Sending Failed, try again";
}
}
?>
Please help me.
try this way . try to send mail from an ajax . Please write your code like below
javascript
<script type="text/javascript">
function sendEnquiryform(){
var name=$('#name').val();
var email=$('#email').val();
var message=$('#message').val();
$.post("send_mail.php",'name='+name+'&email='+email'&message='+message,function(result,status,xhr) {
if( status.toLowerCase()=="error".toLowerCase() )
{ alert("An Error Occurred.."); }
else {
//alert(result);
$('#sucessMessage').html(result);
}
})
.fail(function(){ alert("something went wrong. Please try again") });
}
</script>
Your html
<form method="post" name="FrmEnquiry" id="FrmEnquiry" action="" onsubmit="sendEnquiryform();">
<input name="name" id="name" required="required" placeholder="Your Name">
<input name="email" id="email" type="email" required="required" placeholder="Your Email">
<div class="clearfix"> </div>
<textarea name="message" id="message" cols="20" rows="5" required="required" placeholder="Message"></textarea>
<div class="submit">
<input id="submit" name="submit" type="submit" value="Submit">
</div>
</form>
<span id="sucessMessage"> </span>
send_mail.php
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: agriindiaexp.com';
$to = 'shridhar.kagi#gmail.com';
$subject = 'Email Inquiry';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
if ($_POST['submit']) {
if (mail ($to, $subject, $body, $from)) {
$success = "Message successfully sent";
} else {
$success = "Message Sending Failed, try again";
}
}
?>
this will display your message in your page.Please try this. This is working fine in my case.
You could post the form to the same page and check for a success message there, like this.
<?php
if ($_POST['submit']) {
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: agriindiaexp.com';
$to = 'shridhar.kagi#gmail.com';
$subject = 'Email Inquiry';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
if (mail ($to, $subject, $body, $from)) {
$success = "Message successfully sent";
} else {
$success = "Message Sending Failed, try again";
}
}
?>
...other html....
<div id="message"><?php if(isset($success)){ echo $success; } ?></div>
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input name="name" required="required" placeholder="Your Name">
<input name="email" type="email" required="required" placeholder="Your Email">
<div class="clearfix"> </div>
<textarea name="message" cols="20" rows="5" required="required" placeholder="Message"></textarea>
<div class="submit">
<input id="submit" name="submit" type="submit" value="Submit">
</div>
</form>
...other html....
getting the error in java script.
function sendEnquiryform(){
var fname=$('#fname').val();
var email=$('#email').val();
var pd=$('#pd').val();
var pg=$('#pg').val();
var ced=$('#ced').val();
var score=$('#score').val();
var message=$('#message').val();
$.post("mail.php",'fname='+name+'&email='+email' +'&pd='+pd' +'&pg='+pg' +'&ced='+ced' +'&score='+score'&message='+message,function(result,status,xhr) }
if( status.toLowerCase()=="error".toLowerCase() )
{ alert("An Error Occurred.."); }
else {
//alert(result);
$('#sucessMessage').html(result);
}
})
.fail(function(){ alert("something went wrong. Please try again") });
}
Using the mail.php on the same page where the form is could do the magic. the following code did the magic.
<?php
$from = '';
$sendTo = 'email#email.com';
$subject = 'New message from contact form';
$fields = array('name' => 'Name', 'email' => 'Email', 'subject' => 'Subject', 'message' => 'Message');
$okMessage = 'Thank you for your message. I will write back soon.';
$errorMessage = 'There is an error while sending message. Please try again later.';
try {if (!empty($_POST)) {
$emailText = "You have a new message from your contact form\n=====\n";
foreach ($_POST as $key => $value) {
if (isset($fields[$key])) {
$emailText .= "$fields[$key]: $value\n";
}
}
$headers = array('Content-Type: text/plain; charset="UTF-8";',
'From: ' . $from,
'Reply-To: ' . $from,
'Return-Path: ' . $from,
);
mail($sendTo, $subject, $emailText, implode("\n", $headers));
$responseArray = array('type' => 'success', 'message' => $okMessage);
}
}
catch (\Exception $e) {
$responseArray = array('type' => 'danger', 'message' => $e->getMessage());
}
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$encoded = json_encode($responseArray);
header('Content-Type: application/json');
echo $encoded;
} else {
echo $responseArray['message'];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
$(function () {
$('#contact-form').on('submit', function (e) {
if (!e.isDefaultPrevented()) {
var url = "contact.php";
$.ajax({
type: "POST",
url: url,
data: $(this).serialize(),
success: function (data) {
var messageAlert = 'alert-' + data.type;
var messageText = data.message;
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×
</button>' + messageText + '</div>';
if (messageAlert && messageText) {
$('#contact-form').find('.messages').html(alertBox);
$('#contact-form')[0].reset();
}
}
});
return false;
}
})
});
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xl-8 offset-xl-2">
<h1>CONTACT FORM</h1><hr>
<p class="lead">By filling out the contact form; You may have information about us and current news.</p>
<form id="contact-form" method="post" role="form" novalidate="true">
<div class="messages"></div>
<div class="controls">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="form_name">Full Name *</label>
<input id="form_name" type="text" name="name" class="form-control" placeholder="Please fill the name field *" required="required" data-error="You must fill the name field">
<div class="help-block with-errors alert-danger"></div>
</div>
</div>
<div class="col-lg-6"></div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="form_email">E-mail *</label>
<input id="form_email" type="email" name="email" class="form-control" placeholder="Please fill the email field *" required="required" data-error="You must fill the email field">
<div class="help-block with-errors alert-danger"></div>
</div>
</div>
<div class="col-lg-6"></div>
</div>
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="form_subject">Subject *</label>
<input id="form_subject" type="text" name="subject" class="form-control" placeholder="Please fill the subject field *" required="required" data-error="You must fill the subject field">
<div class="help-block with-errors alert-danger"></div>
</div>
</div>
<div class="col-lg-6"></div>
</div>
<div class="form-group">
<label for="form_message">Message *</label>
<textarea id="form_message" name="message" class="form-control" placeholder="Please fill the message field *" rows="4" required="required" data-error="You must fill the message field"></textarea>
<div class="help-block with-errors alert-danger"></div>
</div>
<input type="submit" class="btn btn-success btn-send" value="Submit">
<p class="text-muted" style="padding-top: 5px;"><strong>*</strong>This field must be fill.</p>
</div><!-- controls all end -->
</form><!-- form all end -->
</div><!-- col-xl-8 offset-xl-2 end -->
</div><!-- row all end -->
</div><!-- container all end -->
</body>
Please use this code
<?php
if ($_POST['submit']) {
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: agriindiaexp.com';
$to = 'shridhar.kagi#gmail.com';
$subject = 'Email Inquiry';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
if (mail ($to, $subject, $body, $from)) {
$success = "Message successfully sent";
} else {
$success = "Message Sending Failed, try again";
}
echo $success;
}
?>
I am working on a form where we need to upload the file. The form is processing with Ajax and the data is being posted on the email with no problem except file upload.
Now we want to allow user to upload multiple image files that will be stored on our server and we will get the link to the images in the email.
Please have a look at the codes below:
Form HTML code:
<div class="col-sm-12">
<div class="well">
<form id="ajax-contact" action="http://websitename.com/mailer.php" method="post" enctype="multipart/form-data">
<h2>Personal Details</h2>
<div class="login-wrap">
<div class="form-group">
<label class="control-label" for="name">Name</label>
<input name="name" placeholder="enter your name" id="name" class="form-control" type="text">
</div>
<div class="form-group">
<label class="control-label" for="tel">Telephone</label>
<input name="tel" placeholder="enter your telephone" id="tel" class="form-control" type="text">
</div>
<div class="form-group">
<label class="control-label" for="email">Email</label>
<input name="email" placeholder="enter your email" id="input-email" class="form-control" type="text">
</div>
<div class="form-group">
<label class="control-label" for="comments">Comments</label>
<textarea name="comments" placeholder="your comments" id="comments" class="form-control" type="text"></textarea>
</div>
</div>
<h2 style="margin-top:20px;">Product Details</h2>
<div class="login-wrap">
<div class="form-group">
<label class="control-label" for="make">Make/Brand</label>
<input name="make" placeholder="enter your make" id="make" class="form-control" required="" type="text">
</div>
<div class="form-group">
<label class="control-label" for="model">Model</label>
<input name="model" placeholder="enter your model" id="model" class="form-control" required="" type="text">
</div>
<div class="form-group">
<label class="control-label" for="reference">Reference Number</label>
<input name="reference" placeholder="enter your reference" id="reference" class="form-control" type="text">
</div>
<div class="form-group">
<label class="control-label" for="condition">Condition</label>
<select id="condition" name="condition" required="">
<option>Mint</option>
<option>Used</option>
</select>
</div>
<div class="form-group">
<label for="images">Upload Images</label>
<input id="images" name="images" multiple="" required="" type="file">
<p class="help-block">upload maximum 4 images</p>
</div>
<div class="form-group">
<label class="control-label" for="price">Expected Price</label>
<input name="price" placeholder="enter your price" id="price" class="form-control" required="" type="text">
</div>
<div class="checkbox">
<label>
<input value="" type="checkbox">
With Box
</label>
</div>
<div class="checkbox disabled">
<label>
<input value="" type="checkbox">
With Papers
</label>
</div>
</div>
<input value="Submit" class="btn btn-primary button" type="submit">
</form>
</div>
</div>
</div>
AJAX:
$(function() {
// Get the form.
var form = $('#ajax-contact');
// Get the messages div.
var formMessages = $('#form-messages');
// Set up an event listener for the contact form.
$(form).submit(function(e) {
// Stop the browser from submitting the form.
e.preventDefault();
// Serialize the form data.
var formData = $(form).serialize();
// Submit the form using AJAX.
$.ajax({
type: 'POST',
url: $(form).attr('action'),
data: formData
})
.done(function(response) {
// Make sure that the formMessages div has the 'success' class.
$(formMessages).removeClass('error');
$(formMessages).addClass('success');
// Set the message text.
$(formMessages).text(response);
// Clear the form.
$('#name').val('');
$('#email').val('');
$('#message').val('');
$('#tel').val('');
$('#make').val('');
$('#model').val('');
$('#reference').val('');
$('#condition').val('');
})
.fail(function(data) {
// Make sure that the formMessages div has the 'error' class.
$(formMessages).removeClass('success');
$(formMessages).addClass('error');
// Set the message text.
if (data.responseText !== '') {
$(formMessages).text(data.responseText);
} else {
$(formMessages).text('Oops! An error occured and your message could not be sent.');
}
});
});
});
PHP Form Processor:
<?php
// Only process POST reqeusts.
if ($_SERVER["REQUEST_METHOD"] == "POST") {
// Get the form fields and remove whitespace.
$name = strip_tags(trim($_POST["name"]));
$name = str_replace(array("\r","\n"),array(" "," "),$name);
$email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL);
$tel = filter_var(trim($_POST["tel"]));
$message = trim($_POST["message"]);
$make = trim($_POST["make"]);
$model = trim($_POST["model"]);
$reference = trim($_POST["reference"]);
$condition = trim($_POST["condition"]);
// Check that data was sent to the mailer.
if ( empty($name) OR !filter_var($email, FILTER_VALIDATE_EMAIL)) {
// Set a 400 (bad request) response code and exit.
http_response_code(400);
echo "Oops! There was a problem with your submission. Please complete the form and try again.";
exit;
}
// Set the recipient email address.
// FIXME: Update this to your desired email address.
$recipient = "myemail#mycompany.com";
// Set the email subject.
$subject = "New Contact form Submitted";
// Build the email content.
$email_content = "Name: $name\n";
$email_content .= "Tel: $tel\n";
$email_content .= "Email: $email\n";
$email_content .= "Message: $message\n";
$email_content .= "Make/Brand: $make\n";
$email_content .= "Model: $model\n";
$email_content .= "Reference: $reference\n";
$email_content .= "Condition: $condition\n";
// Build the email headers.
$email_headers = "From: $name <$email>";
// Send the email.
if (mail($recipient, $subject, $email_content, $email_headers)) {
// Set a 200 (okay) response code.
http_response_code(200);
echo "Thank You! Your message has been sent.";
} else {
// Set a 500 (internal server error) response code.
http_response_code(500);
echo "Oops! Something went wrong and we couldn't send your message.";
}
} else {
// Not a POST request, set a 403 (forbidden) response code.
http_response_code(403);
echo "There was a problem with your submission, please try again.";
}
?>
I have a problem with checking if a email is valid. but the weird is that i have the same form on to different pages/urls, and on one of the forms it keeps saying that the email is invalid and on the form its valid.
The form on this page works - http://night.sendme.to/about
the form on this page doesnt - http://night.sendme.to/book/jokeren
The HTML on the forms is the same
<form action="" method="post" id="myform">
<div class="form-group">
<label for="name">Navn *</label>
<input type="text" class="form-control" id="name" name="name" placeholder="Navn" required="required">
</div>
<div class="form-group">
<label for="corp">Virksomhed</label>
<input type="text" class="form-control" id="corp" name="corp" placeholder="Virksomhed">
</div>
<div class="form-group">
<label for="email">Email adresse *</label>
<input type="email" class="form-control" id="email" name="email" placeholder="Email adresse" required="required">
</div>
<div class="form-group">
<label for="tel">Telefon *</label>
<input type="tel" class="form-control" id="tel" name="tel" placeholder="Telefon" required="required">
</div>
<div class="form-group">
<label for="message">Kommentar</label>
<textarea class="form-control" id="message" name="message" rows="10" required="required"></textarea>
</div>
<button type="submit" class="btn btn-default" id="submit">Send</button>
</form>
<div id="success" style="color:red;"></div>
The PHP is this
<?php // Here we get all the information from the fields sent over by the form.
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$to = 'YOURMAIL';
$subject = 'the subject';
$message = 'FROM: '.$name.' Email: '.$email.'Message: '.$message;
$header = "MIME-Version: 1.0" . "\r\n";
$header .= "Content-type: text/html; charset=iso-8859-1" . "\r\n";
$header .= "from:".$_POST['email'];
if (filter_var($email, FILTER_VALIDATE_EMAIL)) { // this line checks that we have a valid email address
mail($to, $subject, $message, $header); //This method sends the mail.
echo "Your email was sent!";
echo var_dump(filter_var($email, FILTER_VALIDATE_EMAIL));
} else {
echo "Invalid Email, please provide an correct email.";
echo var_dump(filter_var($email, FILTER_VALIDATE_EMAIL));
}
?>
The javascript is this
$(document).ready(function(){
$('#submit').click(function(){
$.post("email.php", $("#myform").serialize(), function(response) {
$('#success').html(response);
//$('#success').hide('slow');
});
return false;
});
});
Hope some one can help, why the form only works on the http://night.sendme.to/about and the others
So, to not leave this question answer-less:
In your HTML code, you actually had <form action="" method="post" id="myform"> in both pages – but in your second page, you had another <form> tag right before it … and because of this invalid HTML, the browser ignored the second form tag, and that made $("#myform").serialize() not return any data at all, because it could not find the form element with that id.
You should always validate your HTML code. This helps avoiding such errors.
I'm building a contact form for my site using jQuery validation plugin, ajax call to forward the data to the PHP file, and finally sending the email. Seems like the data is not passed to the php mailer. I'm new to server side technologies, I read a lot but still can't make this working, so please advise me.
the form:
<form class="form-horizontal" role="form" id="contactForm" name="contactForm" method="post">
<div class="form-group">
<label class="col-lg-2 control-label" for="inputName">Name</label>
<div class="col-lg-10">
<input class="form-control" id="inputName" name="inputName" placeholder="Your name" type="text" value="" required>
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="inputEmail">Email</label>
<div class="col-lg-10">
<input class="form-control" id="inputEmail" name="email" placeholder="your#email.com" type="email" value="" required>
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="inputMessage">Message</label>
<div class="col-lg-10">
<textarea class="form-control" id="inputMessage" name="inputMessage" placeholder="Message" rows="3" required></textarea>
<button class="btn btn-success pull-right" type="submit" name="submit" id="submit">Send</button>
</div>
</div>
the javascript:
/*validate contact form */
$(function() {
$('#contactForm').validate({
rules: {
inputName: {
required: true,
minlength: 2
},
inputEmail: {
required: true,
email: true
},
inputMessage: {
required: true
}
},
messages: {
name: {
required: "name required",
minlength: "name must be at least 2 characters"
},
email: {
required: "email required"
},
message: {
required: "message required",
minlength: 10
}
},
submitHandler: function(form) {
$('form').ajaxSubmit({
type:"POST",
data: $(form).serialize(),
url:"index2.php",
success: function() {
alert("message sent");
},
error: function() {
alert("due to an error msg wasnt sent");
}
});
}
});
});
php file:
<?php
if ($_POST["submit"]) {
$name = trim($_POST['inputName']);
$email = trim($_POST['inputEmail']);
$message = $_POST['inputMessage'];
$from = 'Demo Contact Form';
$to = 'example#example.com';
$subject = 'Message from Contact Demo ';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
mail($to, $subject, $body, $from);
}
?>
$(form).serialize() doesn't include the submit field (how would it know which submit button you clicked on?), so if ($_POST['submit']) will never succeed. Use:
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
instead.
Or, if this script is only used for AJAX calls, and not loaded directly by the browser, you can omit that check entirely, as in Glizzweb's answer.
better use checking if:
if (isset($_POST['inputName'])){
//rest part here
}
// and see if the file is in same directory otherwise give relative path.
use this to send form content:
submitHandler: function() {
$('form').ajaxSubmit({
type:"POST",
data: $('#contactForm').serialize(),
url:"submit.php",
success: function() {
alert("message sent");
},
error: function() {
alert("due to an error msg wasnt sent");
}
});
}
In your ajax.php remove $_POST["submit"]
<?php
$name = trim($_POST['inputName']);
$email = trim($_POST['inputEmail']);
$message = $_POST['inputMessage'];
$from = 'Demo Contact Form';
$to = 'example#example.com';
$subject = 'Message from Contact Demo ';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
mail($to, $subject, $body, $from);
?>
In ajax page $_POST['submit'] need remove because you post values using "$(form).serialize()" and In you not post value to ajax page. remove if condition "if ($_POST["submit"]) {}" and change like this "if (!empty($_POST["inputName"])) { }"
$name = trim($_POST['inputName']);
$email = trim($_POST['inputEmail']);
.....
....
....
Try this code:
<html>
<head>
<script src="js/jquery-1.11.0.js" type="text/javascript"></script>
<script src="js/jquery.validate.min.js" type="text/javascript"></script>
<script src="js/additional-methods.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$('#contactForm').submit(function(e){
e.preventDefault();
$('#contactForm').validate({
rules: {
inputName: {
required: true,
minlength: 2
},
inputEmail: {
required: true,
email: true
},
inputMessage: {
required: true
}
},
messages: {
name: {
required: "name value required",
minlength: "name must be at least 2 characters"
},
email: {
required: "email is required"
},
message: {
required: "message is required",
minlength: 10
}
},
submitHandler: function(form) {
alert($('form').html());
$.ajax({
type:"POST",
data: $(form).serialize(),
url:"test1.php",
success: function() {
alert("message sent");
},
error: function() {
alert("due to an error msg wasnt sent");
}
});
}
});
});
});
</script>
</head>
<body>
<form class="form-horizontal" role="form" id="contactForm" name="contactForm" method="post">
<div class="form-group">
<label class="col-lg-2 control-label" for="inputName">Name</label>
<div class="col-lg-10">
<input class="form-control" id="inputName" name="inputName" placeholder="Your name" type="text" value="" >
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="inputEmail">Email</label>
<div class="col-lg-10">
<input class="form-control" id="inputEmail" name="email" placeholder="your#email.com" type="email" value="" >
</div>
</div>
<div class="form-group">
<label class="col-lg-2 control-label" for="inputMessage">Message</label>
<div class="col-lg-10">
<textarea class="form-control" id="inputMessage" name="inputMessage" placeholder="Message" rows="3" ></textarea>
<input class="btn btn-success pull-right" type="submit" name="submit" id="submit" value="Send">
</div>
</div>
</body>
</html>
It is working and showing message sent and ajax call also made. you are doing some mistakes while performing ajax call. as jquery validation plugin does not provide any ajaxsubmit function instead use jquery ajax function as i have used. try it and let me know for further issue.
Change this code to fit your requirement.
I am using a simple html form as a contact, and when fields and submitted the form does not clear the fields.
this is my php
I read online in few places and I've learned that I have to use the .reset , but I am not familiar with php a lot. I am not sure where would I add the .reset and how.
<?
$name = $_REQUEST["name"];
$email = $_REQUEST["email"];
$msg = $_REQUEST["msg"];
$to = "example#example.com";
if (isset($email) && isset($name) && isset($msg)) {
$subject = "Message / Closure Film";
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
$headers .= "From: ".$name." <".$email.">\r\n"."Reply-To: ".$email."\r\n" ;
$msg = "Name: $name:<br/> Email: $email <br/> Message: $msg";
$mail = mail($to, $subject, $msg, $headers);
if($mail)
{
echo 'success';
}
else
{
echo 'failed';
}
}
?>
my html
<div id="contact">
<div class="container">
<div class="row-fluid PageHead">
<div class="span12">
<h3>CONTACT US<span> <img src="images/underline.png" alt="______"></span></h3>
</div>
</div>
<div class="row-fluid ContactUs">
<div class="span6 offset3">
<form class="form-horizontal" id="phpcontactform">
<div class="control-group">
<input class="input-block-level" type="text" placeholder="Full Name" name="name" id="name">
</div>
<div class="control-group">
<input class="input-block-level" type="email" placeholder="Email" name="email" id="email">
</div>
<div class="control-group">
<textarea class="input-block-level" rows="10" name="message" placeholder="Your Message" id="message"></textarea>
</div>
<div class="control-group">
<p>
<input class="btn btn-danger btn-large" type="submit" value="Send Message">
</p>
<span class="loading"></span> </div>
</form>
</div>
added this to the head of my html, but didnt get any result
<script type="javascript">
$('#phpcontactform').trigger("reset");
</script>
Try:
<script type="javascript">
$(document).ready(function() {
$('#phpcontactform')[0].reset();
});
</script>
I'm not sure if you're trying to do an ajax submit and keep the user on the page, or just submit the form. But the line you're looking for is $("#phpcontactform")[0].reset();, you could wrap that in a $(document).ready() if you needed to!