html and php form will not submit to email? - javascript

I've been trying to submit a form that is on my website but the form will not submit. I am not a php expert and I can not tell where my error is. The php file opens instead of sending to my two emails.
html
<form action="email.php" method="post" name="emailForm">
<div class="form-group">
<label for="Name"></label>
<input class="form-control name" placeholder="Name" id="Name" name="name">
</div>
<div class="form-group">
<label for="Email"></label>
<input class="form-control email" placeholder="Email" id="Email" name="email">
</div>
<div class="form-group">
<label for="Subject"></label>
<input class="form-control subject" placeholder="Subject" id="Subject" name="subject">
</div>
<div class="form-group">
<label for="Message"></label>
<textarea class="form-control Message" placeholder="Message" id="Message" name="message"></textarea>
</div>
<input type="submit" id="button" class="btn btn-default button_submit"></input>
</form>
and I have the php file in the main directory
and it contains
<?php
$name = $_POST['name'];
$visitor_email = $_POST['email'];
$subject = $_POST['subject'];
$message = $_POST['message'];
$email_from = "georgestcm#gmail.com";
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $visitor_email \r\n";
$email_subject = "New Form submission";
$to = "georgestcm#gmail.com, yahwehown#gmail.com";
$email_body = "You have received a new message from the user $name.\n"."Here is the message:\n $message".
mail($to,$email_subject,$email_body,$headers);
?>
and my form validation is in in jquery. That is why I have not done it in php, because I am not a php expert.
jquery
$(document).ready(function() {
var name = $('input.name');
var email = $('input.email').prop('disabled',true);
var subject = $('input.subject').prop('disabled',true);
var message = $('textarea.Message').prop('disabled',true);
var button = $('input#button').prop('disabled',true);
name.on('keyup',function() {
if($(this).val().length > 0) {
email.prop('disabled',false);
} else {
email.prop('disabled',true);
}
});
email.on('keyup',function() {
if($(this).val().length > 0 && $(this).val().includes('#') && $(this).val().includes('.com')) {
subject.prop('disabled', false);
message.prop('disabled',false);
} else {
subject.prop('disabled', true);
message.prop('disabled',true);
button.prop('disabled',true);
}
});
message.on('keyup',function() {
if($(this).val().length > 0){
button.prop('disabled',false);
}
})
button.on('click', function() {
name.val('');
email.val('');
subject.val('');
message.val('');
})
})
I want to send email to my two emails.

Related

How to display php alert message in html using sweetalert

this is my contact form.
I need to display message in sweetalert after success/fail submission of form. The error/success message is in php alert.
<form class="contact-form" action="" method="post" id="form_id">
<div class="form-group">
<input type="text" name="name" class="form-control" placeholder="Full Name" required>
</div>
<div class="form-group">
<input type="number" name="number" class="form-control" placeholder="Phone No." required>
</div>
<div class="form-group">
<input type="text" name="country" class="form-control" placeholder="Country" required>
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" placeholder="Your Email Id" required>
</div>
<div class="form-group">
<input type="date" name="date" class="form-control" placeholder="Travel Date" required>
</div>
<div class="form-group">
<textarea class="form-control" name="message" placeholder="Your Message" style="height:140px"></textarea>
</div>
<button type="submit" class="btn btn-primary" name="submit" value="send">SEND MESSAGE</button>
</form>
This is my php code
for send mail
use PHPMailer\PHPMailer\PHPMailer;
require_once 'phpmailer/Exception.php';
require_once 'phpmailer/PHPMailer.php';
require_once 'phpmailer/SMTP.php';
$mail = new PHPMailer(true);
$alert = '';
if(isset($_POST['submit'])){
$name = $_POST['name'];
$email = $_POST['email'];
$number = $_POST['number'];
$country = $_POST['country'];
$message = $_POST['message'];
$package=$_POST['package'];
$date=$_POST['date'];
try{
$mail->isSMTP();
$mail->Host = 'smtp.gmail.com';
$mail->SMTPAuth = true;
$mail->Username = ''; // Gmail address which you want to use as SMTP server
$mail->Password = ''; // Gmail address Password
$mail->SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS;
$mail->Port = '587';
$mail->setFrom(''); // Gmail address which you used as SMTP server
$mail->addAddress(''); // Email address where you want to receive emails (you can use any of your gmail address including the gmail address which you used as SMTP server)
$mail->isHTML(true);
$mail->Subject = 'Message Received';
$mail->Body = "<h3>Name : $name <br><br>Phone No: $number <br><br> Country: $country <br><br> Email: $email <br><br>Arrival Date: $date <br><br>Package: $package <br><br> Message: $message</h3>";
$mail->send();
$alert = 'alert-success';
} catch (Exception $e){
$alert = 'alert-error';
}
}
this is my javascript code
swal alert
is alert-success check
success:function(alert) {
if(alert == 'alert-success'){
swal("Good job!", "You clicked the button!", "success");
}
else swal("Something is missing!!!!!", "Try again","error");
}
if not using ajax you can do this :
<script>
var alert = '<?php echo $alert;?>';
if(alert == 'alert-success'){
alert('yes');//for test
swal("Good job!", "You clicked the button!", "success");
}
else if(alert=='alert-error'){
alert('no');//for test
swal("Something is missing!!!!!", "Try again","error");
}
</script>
you should have to be use ajax for this sweet alert operation.
$.ajax({
.... other settings you already have
error: function (xhr, ajaxOptions, thrownError) {
swal("success!", "Form has been submitted", "success");
}
});

Send Form data in Email using PHP without refreshing the page

I have a contact section in my website. I want when a user submit the form all the data should be sent in email plus the page don't reload.
My form:
<label for="name">Name:</label>
<input type="text" class="form-control" name="name" id="name" >
</div>
<div class="form-group">
<label for="email">E-Mail:</label>
<input type="email" class="form-control" name="email" id="email" >
</div>
<div class="form-group">
<label for="mobile">Mobile Number:</label>
<input type="text" class="form-control" name="mobile" id="mobile">
</div>
<div class="form-group">
<label for="message">Message:</label>
<textarea class="form-control" rows="5" name="message" id="message"></textarea>
</div>
<button type="submit" id="send" class="btn btn-primary" style="width: 100%" name="form_submit">Send Message</button>
Javascript
$(document).ready(function(){
$('#send').click(function(){
var name = $('#name').val();
var email = $('#email').val();
var mobile = $('#mobile').val();
var message = $('#message').val();
var varData = 'name=' + name + '&email=' + email + '&mobile=' + mobile + '&message=' + message;
$.ajax({
type: 'POST',
url: 'process.php',
data: varData,
success: function() {
alert("message sent");
}
});
});
});
</script>
Process.php
if (isset( $_POST['form_submit'] ) ) {
// Do processing here.
$name = $_POST['name'];
$email = $_POST['email'];
$mobile = $_POST['mobile'];
$message = $_POST['message'];
if ($name == '' || $email == '' || $mobile=='' || $message=='')
{
echo "<script> alert('please fill the field');
</script>";
exit;
}
elseif ($_POST["email"]<>'') {
$ToEmail = 'email#gmail.com';
$EmailSubject = 'Website Contact form';
$mailheader = "From: ".$_POST["email"]."\r\n";
$mailheader .= "Reply-To: ".$_POST["email"]."\r\n";
$mailheader .= "Content-type: text/html; charset=iso-8859-1\r\n";
$MESSAGE_BODY = "Name: ".$_POST["name"]."<br><br>";
$MESSAGE_BODY .= "email: ".$_POST["email"]."<br>";
$MESSAGE_BODY .= "mobile: ".nl2br($_POST["mobile"])."<br>";
$MESSAGE_BODY .= "message: ".nl2br($_POST["message"])."";
mail($ToEmail, $EmailSubject, $MESSAGE_BODY, $mailheader) or die ("Failure");
echo "<script> alert('mail sent')
</script>";
exit;
} else{
echo "<script> alert ('there is some problem');</script>";
};
}
?>
The problem is the form is not using the code mentioned in "process.php"
How can I ensure the form data is sent in email? I have searched the previous answers but couldn't fix this.

Display message after php form submit INSIDE same page

on my INDEX.HTML page I have a subscription form that writes data to a DB with php. Everything works honky-dori.
When I submit the form the site goes to the PHP file I use to submit the emails to me and the visitor. I then can echo a thank you message. However...I dont want the message to appear inside this php page....I want the form to disappear and the message appear on my index page inside a a tag...e.g a DIV.
How do I do this? If I need to use AJAX or JQUERY...could you please point me to the right place?
Here are some of the code:
<div class="container-fluid">
<form action="thankyou.php" method="post">
<div class="form-group">
<label for="firstname">First Name:</label>
<input type="input" class="form-control" id="firstname" name="firstname">
<label for="lastname">Last Name:</label>
<input type="input" class="form-control" id="lastname" placeholder="" name="lastname">
<label for="email">Email:</label>
<input type="email" class="form-control" id="email" placeholder="" name="email">
</div>
<button type="submit" class="btn btn-warning">Submit</button>
</form>
</div>
thankyou.php
<?php
require 'connection.php';
$conn = Connect();
$firstname = $conn->real_escape_string($_POST['firstname']);
$lastname = $conn->real_escape_string($_POST['lastname']);
$email = $conn->real_escape_string($_POST['email']);
$myemail = "myemailaddress";
$query = "INSERT into subscription (firstname,lastname,email) VALUES('" . $firstname . "','" . $lastname . "','" . $email . "')";
$success = $conn->query($query);
$subject1 = "New eBook Subscriber";
if (!$success) {
die("Couldn't enter data: ".$conn->error);
} else {
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= 'From: ' .$myemail. "\r\n";
$message = "some message";
$messageb = "some message";
mail($email, $subject, $messageb, $headers);
mail($myemail, $subject1, $message, $headers);
?><META HTTP-EQUIV="Refresh" CONTENT="1;URL=index.html">
<?php
$conn->close();
}
?>
Try this solution
<div class="container-fluid">
<form action="thankyou.php" method="post" id="form">
<div class="form-group">
<label for="firstname">First Name:</label>
<input type="input" class="form-control" id="firstname" name="firstname">
<label for="lastname">Last Name:</label>
<input type="input" class="form-control" id="lastname" placeholder="" name="lastname">
<label for="email">Email:</label>
<input type="email" class="form-control" id="email" placeholder="" name="email">
</div>
<button type="submit" class="btn btn-warning">Submit</button>
</form>
</div>
<script>
$('#form').on('submit', function(event) {
event.preventDefault(); //stops form on submit
var formData = {};
$.each($("#form").serializeArray(), function (i, field) {
formData[field.name] = field.value;
});
$.ajax({
url: 'thankyou.php',
data: formData,
method:'POST',
success: function(response) {
$(this).hide(); //sets css display:none to form
var message = "Thank you!";
$('.container-fluid').html(message);
}
});
});
</script>
Set the redirect after the successfully email the data and set a session variable and print this session variable in the html page. this may solve your problem however you can also use ajax to send the data and solve this problem.

How to show success message below html form after form submit which is being handled by different php file

There is a form in my index.php file. This form is handling from a different php file named send-mail.php. I want to show a message inside alert div in index.php file. Can this be done by php or javascript will be needed too?
index.php:
<section id="contact">
<form action="send-mail.php" id="form" method="post" name="form">
<input id="name" name="name" placeholder="your name" type="text" required>
<input id="email" name="email" placeholder="your e-mail" type="email" required>
<textarea cols="50" id="message" name="message" placeholder="your enquiry" rows="4" required></textarea>
<input type="submit" name="submit" id="submit" value="Send Message">
</form>
<div class="alert alert-dismissible fade in hide" role=alert>
<button type=button class=close data-dismiss=alert aria-label=Close><span aria-hidden=true>×</span></button>
</div>
</section>
send-mail.php:
<?php
if(isset($_POST['submit'])){
// Get the submitted form data
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
// Recipient email
$toEmail = 'user#example.com';
$emailSubject = 'Contact Request Submitted by '.$name;
$htmlContent = '<h2>Contact Request Submitted</h2>
<h4>Name</h4><p>'.$name.'</p>
<h4>Email</h4><p>'.$email.'</p>
<h4>Message</h4><p>'.$message.'</p>';
// Set content-type header for sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
// Additional headers
$headers .= 'From: '.$name.'<'.$email.'>'. "\r\n";
// Send email
if(mail($toEmail,$emailSubject,$htmlContent,$headers)){
$statusMsg = 'Your contact request has been submitted successfully !';
$msgClass = 'alert-success';
header('location: index.php#contact');
}else{
$statusMsg = 'Your contact request submission failed, please try again.';
$msgClass = 'alert-danger';
header('location: index.php#contact');
}
}
?>
Change your redirects to:
header('location: index.php?result='.$msgClass.'#contact');
Then adding the following to your index.php file:
if ($_GET['result']=="alert-success") {
// display success message here
} elseif ($_GET['result']=="alert-danger") {
// display error message here
}

How do I force form submit with Jquery

Wish you all a happy 2015!
I have a simple contact us php form. I am validating it with parsley.js. The validation works fine but I am receiving a lot of spam mails.
I believe if I can force the form to be submitted only if Jquery is enabled, then it should solve my problem (right?).
I'm not an expert with PhP/ Jquery and any help will be appreciated.
Here is my PHP code
<?php
// Define Variables i.e. name tag, as per form and set to empty
$contact_name = $contact_email = $contact_phone = $contact_message = "";
// Sanitize data and use friendly names
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$name = test_input($_POST["contact_name"]);
$email = test_input($_POST["contact_email"]);
$phone = test_input($_POST["contact_phone"]);
$message = test_input($_POST["contact_message"]);
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
// Set values
$to = 'info#foryourservice.in';
$subject = 'New Message from Website';
$headers = 'From: info#domainname.com' . "\r\n" .
'Reply-To: info#domainname.com' . "\r\n" .
'X-Mailer: PHP/' . phpversion();
// Set Email content
$emailcontent = "A new message has been submitted from the website.
\n
Name : $name
Email : $email
Phone : $phone
Message : $message";
// Mail function
$send_contact=mail($to,$subject,$emailcontent,$headers);
if($send_contact){
header('Location: index.php#contactusform');
}
else {
echo "<script type='text/javascript'>alert('We encountered an ERROR! Please go back and try again.');</script>";
}
?>
Here is my HTML ( Im using Twitter Bootstrap)
<form role="form" method="POST" action="contactusform.php" id="contactusform" data-parsley-validate>
<div class="col-xs-6">
<div class="form-group" style="margin-bottom: -5px">
<label for="input1"></label>
<input type="text" name="contact_name" class="form-control" id="input1" placeholder="Name*" required data-parsley-required-message="Please enter your name">
</div>
<div class="form-group" style="margin-bottom: -5px">
<label for="input2"></label>
<input type="email" name="contact_email" class="form-control" id="input2" placeholder="Email Address*" data-parsley-trigger="change" required data-parsley-required-message="Please enter a valid Email address">
</div>
<div class="form-group" style="margin-bottom: -5px">
<label for="input3"></label>
<input type="tel" name="contact_phone" class="form-control" id="input3" placeholder="Phone Number*" required data-parsley-type="digits" data-parsley-minlength="10" data-parsley-maxlength="10" data-parsley-required-message="Please enter a 10 digit number">
</div>
<br>
<div class="form-group">
<button type="submit" id="contactbutton" class="btn btn-primary" style="background-color: #A8B645; border-color: transparent">Submit</button>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label for="input4"></label>
<textarea name="contact_message" class="form-control" rows="7" id="input4" placeholder="Message*" required required data-parsley-required-message="Say something!"></textarea>
</div>
</div>
</form>
This is what the Spam Email looks like :
A new message has been submitted from the website.
Name : お買い得アナスイ ミロード大壳り出しランキング
Email : rsilau#gmail.com
Phone : お買い得アナスイ ミロード大壳り出しランキング
Message : Shoppers takes the boast on bag
お買い得アナスイ ミロード大壳り出しランキング http://www.frkapaun.org/dyqfmnwg/ysl-annasuixmraAekm.asp
Add a hidden field to your form:
<input type="hidden" value="0" id="botcheck" name="botcheck" />
Then with jQuery set the value to 1:
$("#botcheck").val("1");
Then server-side check the value of $_POST["botcheck"].
You might want to check if your form is submitted using ajax:
if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
//Process form here
}
For further explanation

Categories