I've got a contact form with 3 fields and a textarea...
I use jQuery to validate it and then php to send emails.
This contact form works fine but, when I receive an email, From field isn't correct. I'd like to want that From field shows text typed in the Name field of the contact form. Now I get a From field like this: <nameOfMyServerAdmin#serverUrl.com>
For example, if an user types "Matthew" in the name field, I'd like to want that this word "Matthew" appears in the From field.
This is my code (XHTML, jQuery, PHP):
<div id="contact">
<h3 id="formHeader">Send Us a Message!</h3>
<form id="contactForm" method="post" action="">
<div id="risposta"></div> <!-- End Risposta Div -->
<span>Name:</span>
<input type="text" id="formName" value="" /><br />
<span>E-mail:</span>
<input type="text" id="formEmail" value="" /><br />
<span>Subject:</span>
<input type="text" id="formSubject" value="" /><br />
<span>Message:</span>
<textarea id="formMessage" rows="9" cols="20"></textarea><br />
<input type="submit" id="formSend" value="Send" />
</form>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#formSend").click(function(){
var valid = '';
var nome = $("#formName").val();
var mail = $("#formEmail").val();
var oggetto = $("#formSubject").val();
var messaggio = $("#formMessage").val();
if (nome.length<1) {
valid += '<span>Name field empty.</span><br />';
}
if (!mail.match(/^([a-z0-9._-]+#[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
valid += '<span>Email not valid or empty field.</span><br />';
}
if (oggetto.length<1) {
valid += '<span>Subject field empty.</span><br />';
}
if (valid!='') {
$("#risposta").fadeIn("slow");
$("#risposta").html("<span><b>Error:</b></span><br />"+valid);
$("#risposta").css("background-color","#ffc0c0");
}
else {
var datastr ='nome=' + nome + '&mail=' + mail + '&oggetto=' + oggetto + '&messaggio=' + encodeURIComponent(messaggio);
$("#risposta").css("display", "block");
$("#risposta").css("background-color","#FFFFA0");
$("#risposta").html("<span>Sending message...</span>");
$("#risposta").fadeIn("slow");
setTimeout("send('"+datastr+"')",2000);
}
return false;
});
});
function send(datastr){
$.ajax({
type: "POST",
url: "contactForm.php",
data: datastr,
cache: false,
success: function(html) {
$("#risposta").fadeIn("slow");
$("#risposta").html('<span>Message successfully sent.</span>');
$("#risposta").css("background-color","#e1ffc0");
setTimeout('$("#risposta").fadeOut("slow")',2000);
}
});
}
</script>
<?php
$mail = $_POST['mail'];
$nome = $_POST['nome'];
$oggetto = $_POST['oggetto'];
$text = $_POST['messaggio'];
$ip = $_SERVER['REMOTE_ADDR'];
$to = "support#matthewlabs.com";
$message = $text."<br /><br />IP: ".$ip."<br />";
$headers = "From: $nome \n";
$headers .= "Reply-To: $mail \n";
$headers .= "MIME-Version: 1.0 \n";
$headers .= "Content-Type: text/html; charset=UTF-8 \n";
mail($to, $oggetto, $message, $headers);
?>
You should be using an email address in the "From:" header. Try this:
$headers = "From: $nome <$mail>\r\n";
$headers .= "Reply-To: $mail\r\n";
Related
Project structure is as follows
C:\xampp\htdocs\myProject\Documentation
C:\xampp\htdocs\myProject\HTML\css
C:\xampp\htdocs\myProject\HTML\images
C:\xampp\htdocs\myProject\HTML\js
C:\xampp\htdocs\myProject\HTML\videos
C:\xampp\htdocs\myProject\HTML\404.html
C:\xampp\htdocs\myProject\HTML\contact.php
C:\xampp\htdocs\myProject\HTML\index.html
C:\xampp\htdocs\myProject\PSD
I have a contact form in index.html that is controlled by a javascript file. This code stops default form submit, performs error checks and then uses ajax to make a post request to contact.php. The javascript code runs, it detects the php (see the alert in the code below just after the axjax funtion call. The value of d is the php script in the alert, but none of the debug lines in the php code get called and it never returns 'success'.
Here is the form
<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 ID" name="email" id="email">
</div>
<div class="control-group">
<input class="input-block-level" type="text" placeholder="Mobile Number" name="mobile" id="mobile">
</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>
here is the javascript
// JavaScript Document
$(document).ready(function() {
$("#phpcontactform").submit(function(e) {
e.preventDefault();
var name = $("#name");
var email = $("#email");
var mobile = $("#mobile");
var msg = $("#message");
var flag = false;
if (name.val() == "") {
name.closest(".control-group").addClass("error");
name.focus();
flag = false;
return false;
} else {
name.closest(".control-group").removeClass("error").addClass("success");
} if (email.val() == "") {
email.closest(".control-group").addClass("error");
email.focus();
flag = false;
return false;
} else {
email.closest(".control-group").removeClass("error").addClass("success");
} if (msg.val() == "") {
msg.closest(".control-group").addClass("error");
msg.focus();
flag = false;
return false;
} else {
msg.closest(".control-group").removeClass("error").addClass("success");
flag = true;
}
var dataString = "name=" + name.val() + "&email=" + email.val() + "&mobile=" + mobile.val() + "&msg=" + msg.val();
$(".loading").fadeIn("slow").html("Loading...");
$.ajax({
type: "POST",
data: dataString,
url: "http://localhost/myProject/HTML/contact.php",
cache: false,
success: function (d) {
alert("d: "+d);
$(".control-group").removeClass("success");
if(d == 'success') // Message Sent? Show the 'Thank You' message and hide the form
$('.loading').fadeIn('slow').html('<font color="green">Mail sent Successfully.</font>').delay(3000).fadeOut('slow');
else
$('.loading').fadeIn('slow').html('<font color="red">Mail not sent.</font>').delay(3000).fadeOut('slow');
}
});
return false;
});
$("#reset").click(function () {
$(".control-group").removeClass("success").removeClass("error");
});
})
And finally here is the php
<?php
echo "<script>console.log('Debug Objects:' );</script>";
$name = $_REQUEST["name"];
$email = $_REQUEST["email"];
$mobile = $_REQUEST["mobile"];
$msg = $_REQUEST["msg"];
echo "<script>";
echo "alert('this also works');";
echo "</script>";
$to = "myemail#gmail.com";
if (isset($email) && isset($name) && isset($msg)) {
$subject = $name."sent you a message via Raaga";
$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 = "From: ".$name."<br/> Email: ".$email ."<br/> Mobile: ".$mobile." <br/>Message: ".$msg;
echo "<script>alert('this maybe works');</script>";
$mail = mail($to, $subject, $msg, $headers);
if($mail)
{
echo 'success';
}
else
{
echo "<script>alert('name:'+$name);</script>";
echo 'failed';
}
}
echo "<script>alert('this finally works');</script>";
?>
I tried moving contact.php to the htdocs root but that didnt work. Have turned off all antivirus and firewalls but that didnt work either. Am at a loss. Thought php was supposed to work out of the box with xampp?
Okay so thanks to ADyson for the help. The issue was not that php isn't running, its that the mail server was not properly configured.
I'm trying to send an E-Mail via HTML-Contactform.
Therefore I created this html:
<form id="contact_form" action="sendMail.php" method="post">
<input id="firstname" name="firstname" type="text" placeholder="Vorname" value="Firstname">
<input id="lastname" name="lastname" type="text" placeholder="Nachname" value="Lastname">
<input id="mail" name="mail" type="text" placeholder="E-Mail" value="firstname.lastname#web.de">
<textarea id="msg" name="msg" placeholder="Ihre Nachricht..." >Hallo</textarea>
<p id="error_print" class="hidden"></p>
<input id="contact_submit" type="submit" title="Senden">
</form>
I am checking the inputs via jQuery and sending it via Ajax to the PHP-File and print my errors to html.
$('#contact_submit').click(function(){
var that = $('#contact_form');
var first_name = $('#firstname').val();
var last_name = $('#lastname').val();
var mail = $('#mail').val();
var msg = $('msg').val();
if(first_name == "" || last_name == "" || mail == "" || msg == "")
{
$('#error_print').removeClass("hidden");
$('#error_print').text("Bitte füllen Sie alle Felder aus");
}
else
{
if( !isValidEmailAddress(mail) )
{
$('#error_print').removeClass("hidden");
$('#error_print').text("Keine korrekte Mail");
}
else
{
if( !$('#error_print').hasClass( "hidden" ) )
{
$('#error_print').addClass("hidden");
}
var url = that.attr('action'),
method = that.attr('method'),
data = {};
that.find('[name]').each(function(index, value)
{
var name = $(this).attr('name')
value = $(this).val();
data[name] = value;
});
//console.log(data);
$.ajax({
url: url,
type: method,
data: data,
success: function(response)
{
$('#error_print').removeClass("hidden");
$('#error_print').text("Mail wurde versendet");
},
error: function(error)
{
$('#error_print').removeClass("hidden");
$('#error_print').text("Fehler - Bitte erneut versuchen");
}
});
}
}
return false;
});
In my PHP I am sending the mail like this:
<?php
if(isset($_POST['firstname'], $_POST['lastname'], $_POST['mail'], $_POST['msg']))
{
$mail = htmlentities($_POST['mail'], ENT_QUOTES);
$firstname = htmlentities($_POST['firstname'], ENT_QUOTES);
$lastname = htmlentities($_POST['lastname'], ENT_QUOTES);
$msg = htmlentities($_POST['msg'], ENT_QUOTES);
$empfaenger = "empf#mydomain.de";
$betreff = "Kontaktaufname";
$from = "From: $fistname $lastname <$mail>";
$text = $msg;
//print_r($_POST);
mail($empfaenger, $betreff, $text, $from)
}?>
I do not know if this is the best way to do it. For that I read a lo about injection in mails. But I am not sure if my script is safe enough.
to send the mail you can try this below
<?php
ini_set("SMTP", "smtp.your_internet_service_provider.com");
ini_set("smtp_port", 25 );
ini_set("sendmail_from", "your_mail#example.com");
ini_set("auth_username", "your_mail#example.com");
ini_set("auth_password", "pwd_of_your_mail");
// For the fields $sender / $copy / $receiver, comma separated if there are multiple addresses
$sender = 'your_mail#example.com';
$receiver = 'receiver_mail#example.com';
$object = 'test msg';
$headers = 'MIME-Version: 1.0' . "\n"; // Version MIME
$headers .= 'Content-type: text/html; charset=ISO-8859-1'."\n"; // the Content-type head for the HTML format
$headers .= 'Reply-To: '.$sender."\n"; // Mail reply
$headers .= 'From: "name_of_sender"<'.$sender.'>'."\n";
$headers .= 'Delivered-to: '.$receiver."\n";
$message = 'Hello from Aotoki !';
if (mail($receiver, $object, $message, $headers)) // Send message
{
echo 'Your message has been sent ';
}
else // error
{
echo "Your message could not be sent";
}
?>
I have been having ongoing issues with this contact form. I am now trying to get the mobile number part to work.
I have been able to get it to work with someone code from here but it loses the format that I would like to keep. Can anyone find a reason why this form is not sending the mobile number?
site: www.krjwoodcraft.com
send.php
<?php
$name = $_POST['name'];
$subject = $_POST['subject'];
$sender = $_POST['email'];
$message= $_POST['message'];
$mobile = $_POST['mobile'];
$your_site_name = "www.krjwoodcraft.com";
$your_email = "rob.catharsis#gmail.com";
// setting header:
$header = "MIME-Version: 1.0\r\n";
$header .= "Content-type: text/html; charset=utf-8\r\n";
$header .= "From: {$name} <{$sender}>\r\n";
// to subject message header
$result = mail($your_email, "Message from ".$your_site_name, nl2br($message), $header);
echo "Your Message has been sent";
?>
contact.js
$(document).ready(function(){
$("#send").click(function(){
var name = $("#name").val();
var email = $("#email").val();
var message = $("#message").val();
var mobile = $("#mobile").val();
var error = false;
if(email.length == 0 || email.indexOf("#") == "-1" || email.indexOf(".") == "-1"){
var error = true;
$("#error_email").fadeIn(500);
}else{
$("#error_email").fadeOut(500);
}
if(message.length == 0){
var error = true;
$("#error_message").fadeIn(500);
}else{
$("#error_message").fadeOut(500);
}
if(name.length == 0){
var error = true;
$("#error_name").fadeIn(500);
}else{
$("#error_name").fadeOut(500);
}
if(error == false){
$("#send").attr({"disabled" : "true", "value" : "Loading..." });
$.ajax({
type: "POST",
url : "send.php",
data: "name=" + name + "&email=" + email + "&subject=" + "You Got Email" + "&message=" + message + "&mobile=" + mobile,
success: function(data){
if(data == 'success'){
$("#btnsubmit").remove();
$("#mail_success").fadeIn(500);
}else{
$("#mail_failed").html(data).fadeIn(500);
$("#send").removeAttr("disabled").attr("value", "send");
}
}
});
}
return false;
});
});
html:
<!-- Contact Form -->
<div class="row">
<div class="span12">
<div class="trac_contactform">
<form id="contact_form" class="row" name="form1" method="post" action="send.php">
<div class="span6">
<input type="text" class="full" name="name" id="name" placeholder="Name" />
<div id="error_name" class="error">Please check your name</div>
</div>
<div class="span6">
<input type="text" class="full" name="email" id="email" placeholder="Email" />
<div id="error_email" class="error">Please check your email</div>
</div>
<div class="span6">
<input type="text" class="full" name="mobile" id="mobile" placeholder="Phone Number"/>
</div>
<div class="span6">
<input type="text" class="full" name="subject" id="subject" placeholder="Subject"/>
</div>
<div class="span12">
<textarea cols="10" rows="10" name="message" id="message" class="full" placeholder="Message"></textarea>
<div id="error_message" class="error">Please check your message</div>
<div id="mail_success" class="success">Thank you. Your message has been sent.</div>
<div id="mail_failed" class="error">Error, email not sent</div>
<p id="btnsubmit">
<input type="submit" id="send" value="Send Now" class="btn btn-large btn-primary btn-embossed" /></p>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<!--END CONTACT PAGE-->
As Hanky 웃 Panky correctly pointed out you are not including the phone number to your email message. Try the following code. I stored the $_POST['message'] in a new variable called $sent_message and modified your $message variable to include the $subject, $sent_message and the $mobile variables.
<?php
$name = $_POST['name'];
$subject = $_POST['subject'];
$sender = $_POST['email'];
$sent_message = $_POST['message'];
$mobile = $_POST['mobile'];
$message = "Subject: " . $subject . "\r\n" . "Message: " . $sent_message . "\r\n" . "Phone number: " . $mobile;
$your_site_name = "www.krjwoodcraft.com";
$your_email = "rob.catharsis#gmail.com";
// setting header:
$header = "MIME-Version: 1.0\r\n";
$header .= "Content-type: text/html; charset=utf-8\r\n";
$header .= "From: {$name} <{$sender}>\r\n";
// to subject message header
$result = mail($your_email, "Message from ".$your_site_name, nl2br($message), $header);
echo "Your Message has been sent";
?>
You did not include it in your mail body. you have passed mobile number in php file. You got the file but you don't use it in your mail body.
include mobile number :
$result = mail($your_email, "Message from ".$your_site_name, nl2br($message."\r\n" . "Phone number: " . $mobile), $header);
i have this code in my contact page.
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/main.js"></script>
<script>
jQuery(document).ready(function() {
$("#submit").click(function()
{
var pattern = /^[a-zA-Z0-9\-_]+(\.[a-zA-Z0-9\-_]+)*#[a-z0-9]+(\-[a-z0-9]+)*(\.[a-z0-9]+(\-[a-z0-9]+)*)*\.[a-z]{2,4}$/;
//var pn = /^(\+91-|\+91|0)?\d{10}$/;
var email = $("#email").val();
var message = $("#message").val();
var subject = $("#subject").val();
var name = $("#name").val();
if(name=="")
{
//$('#empty1').show(1).delay(5000).fadeOut();
$('#name').focus();
return false;
}
else if(message=="")
{
//$('#empty4').show(1).delay(5000).fadeOut();
$('#message').focus();
return false;
}
else if(subject=="")
{
//$('#empty4').show(1).delay(5000).fadeOut();
$('#subject').focus();
return false;
}
else if(!(pattern.test(email)))
{
//$('#error2').show(1);
$('#email').focus();
}
else if(email=="")
{
//$('#empty2').show(1).delay(5000).fadeOut();
$('#email').focus();
return false;
}
else
{
var dataString = 'name='+ name + '&email=' + email + '&message=' + message + '&subject=' + subject;
$.ajax({
type: "POST",
url: "mail.php",
data: dataString,
success: function(){
//$('.success').show('slide').delay(5000).fadeOut();
$("#contact-form")[0].reset();
alert("Your Detail Is Submitted, We Will Connect With You Soon.");
}
});
}
return false;
});
});
and i have form like that.
<form class="b-form b-contact-form m-contact-form" action="" style="margin-bottom: 10px;" id="contact-form">
<div class="input-wrap">
<i class="icon-user"></i>
<input class="field-name" type="text" placeholder="Name (required)" name="name" id="name">
</div>
<div class="input-wrap">
<i class="icon-envelope"></i>
<input class="field-email" type="text" placeholder="Email (required)" name="email" id="email">
</div>
<div class="input-wrap">
<i class="icon-pencil"></i>
<input class="field-subject" type="text" placeholder="Subject" name="suject" id="subject">
</div>
<div class="textarea-wrap">
<i class="icon-pencil"></i>
<textarea class="field-comments" placeholder="Message" name="message" id="message"></textarea>
</div>
<input class="btn-submit btn colored" type="submit" value="Submit Comment" id="submit" name="submit">
</form>
and also i have ajax mail.php page.
<?php
$to = "demo#example.com";
$subject = $_REQUEST["subject"];
$message = "message=".$_REQUEST["message"]."<br />";
$message .= "name=".$_REQUEST["name"]."<br />";
$message .= "email=".$_REQUEST["email"];
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
$headers .= "From:" .$_REQUEST["email"]. "\r\n";
mail($to,$subject,$message,$headers);
?>
i done servers mail forwarding setting, and also i check the ajax call, and what data will it parsing. using console apnel.
but i cant reached the mail in my email id.
please help me, what can i do now?
Here, give this a try.
Your message variables were not properly formatted and I modified your headers a bit.
This worked for me, minus your jQuery method.
<?php
$to = "demo#example.com";
$name = $_REQUEST['name'];
$email = $_REQUEST['email'];
$subject = $_REQUEST['subject'];
$message = $_REQUEST['message'];
$message .= "" . "<br/>";
$message .= "name= $name" . "<br/>";
$message .= "email= $email" . "<br/>";
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
$headers .= "From: $email" . "\r\n" .
"Reply-To: $email" . "\r\n" .
"X-Mailer: PHP/" . phpversion();
if(mail($to,$subject,$message,$headers)){
echo "Success!!";
}
else {
echo "Sorry.";
}
?>
I have this problem with my contact form. When I submit the form I receive 2 identical emails in my box.
Im using JS to check the form for errors and then simple PHP mail() function to send the email.
Here is the PHP code:
<?php
$from = Trim(stripslashes($_POST['email']));
$to = "myemail#gmail.com";
$subject = "Contact Form";
$name = Trim(stripslashes($_POST['name']));
$email = Trim(stripslashes($_POST['email']));
$number = Trim(stripslashes($_POST['number']));
$message = Trim(stripslashes($_POST['message']));
$body = "";
$body .= "Name: ";
$body .= $name;
$body .= "\n\n";
$body .= "E-mail: ";
$body .= $email;
$body .= "\n\n";
$body .= "Telephone Number: ";
$body .= $number;
$body .= "\n\n";
$body .= "Message: ";
$body .= $message;
$body .= "\n\n";
$success = mail($to, $subject, $body, "From: <$from>" . "\r\n" . "Reply-to: <$from>" . "\r\n" . "Content-type: text; charset=utf-8");
?>
And here is the JS:
$(".submit").click(function() {
var name = $("input[name=name]").val();
var email = $("input[name=email]").val();
var number = $("input[name=number]").val();
var message = $("textarea[name=message]").val();
if (defaults['name'] == name || name == "") {
$(".error").text("Please enter your name!");
return false;
} else if (defaults['email'] == email || email == "") {
$(".error").text("Please enter your email!");
return false;
} else if (defaults['number'] == number || number == "") {
$(".error").text("Please enter your number!");
return false;
} else if (defaults['message'] == message || message == "") {
$(".error").text("Plese enter your message!");
return false;
}
var dataString = 'name=' + name + '&email=' + email + '&number=' + number + '&message=' + message;
$(".error").text("Please wait...").hide().fadeIn("fast");
$.ajax({
type: "POST",
url: "contact.php",
data: dataString,
success: function() {
$('#form form').html("");
$('#form form').append("<div id='success'>Your message has been sent! Thank you</div>");
}
});
return false;
});
And here is the HTML form:
<form id="contact" method="post" action="#">
<label for="name">Name:</label>
<input type="text" name="name" required tabindex="1">
<label for="email">Email adress:</label>
<input type="text" name="email" required tabindex="2">
<label for="number">Tel. number:</label>
<input type="text" name="number" tabindex="3">
<label for="message">Your message:</label>
<textarea name="message" rows="10" cols="70" required tabindex="4"></textarea>
<input type="checkbox" id="terms" name="terms" value="terms">I agree to the terms
<input type="submit" name="submit" class="submit more-info" tabindex="5" value="Send">
<span class="error"></span>
</form>
I have been using the same code for all of my contact forms and it worked all right. Could it be hosting/server related issue?
replace your click event
$(".submit").click(function() {
with
$('.submit').unbind('click').click(function() {
code.
What I can assume your click event is binding two times may be due to a lot of the mess in the code
also use this line in the end of the click event function
$('.submit').unbind('click').click(function() {
// your stuff
event.stopImmediatePropagation(); // as long as not bubbling up the DOM is ok?
});
for reference have a look at the link: https://forum.jquery.com/topic/jquery-executes-twice-after-ajax
$(".submit").click(function(e) { ... }) POSTS to your server for the first time.
Because this is a <submit> button, the form will still submit. The form POSTS to your server for the second time.
The solution would be adding a e.preventDefault() at the bottom inside the $(".submit").click function...
$(".submit").click(function(e) {
// ^ add this e
var name = ...;
$.ajax({
...
});
e.preventDefault();
return false;
});
Try removing the jQuery animations:
$(".error").text("Please wait...").hide().fadeIn("fast");
They can sometimes cause problems.