Help to make a conclusion successful transmission of data. I tried in different ways, but it does not work. By clicking on the "Send" button the data is sent, but the message "Data sent successfully".
I need it to form disappeared and instead of it there was a message "Data sent successfully"
submitHandler: function(form){
var $form = $(form);
$.post('form.php', $form.serialize(), function(data){
if (!data || data.status !== 'ok') {
$form.find('input').addClass('error');
return false;
}
forms.fadeOut('slow', function(){
$('.form--success').fadeIn('fast');
});
}, 'json');
return false;
}
});
form.php
if(isset($_POST['submit'])) {
$to = "example#example.com";
$subject = "Contact Form";
$phone = $_POST['phone'];
$mail = $_POST['mail'];
$headers = "From: $phone<$mail>\r\n";
$body = "From: $phone<$mail>\r\n Phone Number: $phone\n E-Mail: $mail\n";
mail($to, $subject, $body, $headers);
exit();
}
http://37.230.210.96/ - testing site
You're not targeting the right element to fade out. You have:
var form = $(form);
To fade that out you would use this:
form.fadeOut('slow', function(){
$('.form--success').fadeIn('fast');
});
forms != form
Related
We are running a website on a local server. After entering the required data into contact form and clicking the button Send, we get the "500 Internal Server Error". I'm assuming this relates to PHP mail configuration for local servers.
PHP:
<?php
if(isset($_POST["name"]) && isset($_POST["email"]) && isset($_POST["msg"])){
$name = $_POST["name"];
$email = $_POST["email"];
$subject = $_POST["subject"];
$msg = nl2br($_POST["msg"]);
$to = "info#companyname.com";
$from = $email;
$message = "<b>Name:</b> ".$name." <br><b>E-mail:</b> ".$email." <br><b>Subject:</b> ".$subject." <br><p> ".$msg." </p>";
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
$headers .= "From: $from" . "\r\n";
if(mail($to, $subject, $message, $headers)){
echo "Success";
}else{
echo "The server failed to send the message. Please try again later.";
}
}
?>
JS:
function _(id){return document.getElementById(id);}
function submitForm(){
_("submit").disabled = true;
_("status").innerHTML = "Please wait...";
var formdata = new FormData();
formdata.append("name", _("name").value);
formdata.append("email", _("email").value);
formdata.append("subject", _("subject").value);
formdata.append("msg", _("msg").value);
var ajax = new XMLHttpRequest();
ajax.open("POST", "contact.php");
ajax.onreadystatechange = function(){
if(ajax.readyState == 4 && ajax.status == 200){
if(ajax.responseText == "Success"){
_("status").innerHTML = "";
_("response").innerHTML = "Your message has been successfully sent.";
}else{
_("status").innerHTML = ajax.responseText;
_("submit").disabled = false;
}
}
}
ajax.send(formdata);
}
I think your problem is caused by SMTP server configuration. There are no syntax errors in the code. If the php would be in wrong folder it would return 404 error not 500.
Try to comment the if/else part of the php file just to make sure the other parts of the file are working.
Solved. The problem was with the configuration of our local server which runs on MS IIS.
I am using a form-to-email.php for a contact form in my website, but I don't really understand php code.
The ready-to-use form-to-email.php file has a line "redirect to thank you page," and I have to build a thank you page for the action.
But I hope the UX could be easier like a pop-up thank you message instead of another page.
Anyone could help me to create the lines? Thank you very much!!
Below is the complete code of form-to-email.php, the line "header('Location: thank-you.html')" is the redirect path, and I'm wondering is there any way to modify the lines?
<?php
if(!isset($_POST['submit']))
{
//This page should not be accessed directly. Need to submit the form.
echo "error; you need to submit the form!";
}
$name = $_POST['name'];
$visitor_email = $_POST['email'];
$message = $_POST['message'];
$agree = $_POST['agree'];
//Validate first
if(empty($name)||empty($visitor_email))
{
echo "Name and email are mandatory!";
exit;
}
if(IsInjected($visitor_email))
{
echo "Bad email value!";
exit;
}
$email_from = 'receiver#gmail.com';//<== update the email address
$email_subject = "letter from customer";
$email_body = "$name\n".
"Message:\n$message\nLINE ID: $line".
$to = "receiver#gmail.com";//<== update the email address
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $visitor_email \r\n";
//Send the email!
mail($to,$email_subject,$email_body,$headers);
//done. redirect to thank-you page.
header('Location: thank-you.html');
// Function to validate against any email injection attempts
function IsInjected($str)
{
$injections = array('(\n+)',
'(\r+)',
'(\t+)',
'(%0A+)',
'(%0D+)',
'(%08+)',
'(%09+)'
);
$inject = join('|', $injections);
$inject = "/$inject/i";
if(preg_match($inject,$str))
{
return true;
}
else
{
return false;
}
}
?>
If you want to use JavaScript, you can use this code to show the message "Thank you for your message" in an alert() box:
Replace header('Location: thank-you.html') with:
echo'
<script>
window.onload = function() {
alert("Thank you for your message");
location.href = "index.php";
}
</script>
';
You can also use below AJAX script to handle it. It will not reload the page and it will give you good user experience. You must include jquery library to work.
$.ajax({
url: "ready-to-use form-to-email.php",
type: "post",
data: {id:xyz},
success: function (response) {
// you will get response from your php page (what you echo or print)
alert('Success') ;
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus, errorThrown);
}
});
I want to allow visitors to download a PDF after they click the form submit button.
The PDF should automatically initiate the "save as dialog" after the Download button is pressed and form details sent.
I am using Javascript to send the details to a PHP form processor. I'm not an expert in either languages and I put the code together from various examples I found online.
In a nutshell, I dont know how to initiate the download automatically after form submit and I dont know whether I should use PHP or Javascript to achieve it.
Appreciate in advance any help or advise given. Thanks
This is the Javascript
$("#fhb_download_form").validator().on("submit", function (event) {
if (event.isDefaultPrevented()) {
formError1();
submitMSG1(false, "Did you fill in the form properly?");
} else {
event.preventDefault();
submitForm1();
}
});
function submitForm1(){
var fhb_fullname = $("#fhb_fullname").val();
var fhb_email = $("#fhb_email").val();
$.ajax({
type: "POST",
url: "php/fhb_form.php",
data: "fhb_fullname=" + fhb_fullname + "&fhb_email=" + fhb_email,
success : function(text){
if (text == "success"){
formSuccess1();
} else {
formError1();
submitMSG1(false,text);
}
}
});
}
function formSuccess1(){
$("#fhb_download_form")[0].reset();
submitMSG1(true, "Download Ebook")
}
function formError1(){
$("#fhb_download_form").removeClass().addClass('shake animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
$(this).removeClass();
});
}
function submitMSG1(valid, msg){
if(valid){
var msgClasses = "h3 text-center tada animated text-success";
} else {
var msgClasses = "h3 text-center text-danger";
}
$("#fhb_msgSubmit").removeClass().addClass(msgClasses).text(msg);
}
And this is the PHP processing code
$errorMSG = "";
if (empty($_POST["fhb_fullname"])) {
$errorMSG = "Name is required ";
} else {
$name = $_POST["fhb_fullname"];
}
if (empty($_POST["fhb_email"])) {
$errorMSG .= "Email is required ";
} else {
$email = $_POST["fhb_email"];
}
$EmailTo = "junk#zenwebcreative.com.au";
$Subject = "Ebook Downloaded by $name";
$Body = "";
$Body .= "Name:\n";
$Body .= $name;
$Body .= "\n\n";
$Body .= "Email:\n";
$Body .= $email;
$Body .= "\n\n";
$success = mail($EmailTo, $Subject, $Body, "From:".$email);
Thanks
Answer is based upon the screenshot you have shared and comments.
On the server-side, you need to remove the line which prints "success". You have to return only the file as response.
On Client-side, update your submitForm1 function as below.
function submitForm1(){
var fhb_fullname = $("#fhb_fullname").val();
var fhb_email = $("#fhb_email").val();
$.ajax({
type: "POST",
url: "php/fhb_form.php",
data: "fhb_fullname=" + fhb_fullname + "&fhb_email=" + fhb_email,
success : function(text){
// Whatever processing you need to do here
formSuccess1();
}
});
}
Please note, you have to check the function as per your functionality. I just want to highlight that you don't need to check text == "success"
I was following a tutorial on youtube about setting up a contact page and for some reason I'm getting an error message in the console saying submitForm is not defined when I press the submit. My issue is I got the same code to work on another website but when I copy the exact same code it doesn't work. Here's my js code:
function _(id){ return document.getElementById(id); }
function submitForm(){
_("mybtn").disabled = true;
_("status").innerHTML = 'please wait ...';
var formdata = new FormData();
formdata.append( "n", _("n").value );
formdata.append( "e", _("e").value );
formdata.append( "m", _("m").value );
var ajax = new XMLHttpRequest();
ajax.open( "POST", "example_parser.php" );
ajax.onreadystatechange = function() {
if(ajax.readyState == 4 && ajax.status == 200) {
if(ajax.responseText == "success"){
_("my_form").innerHTML = '<h2>Thanks '+_("n").value+', your message has been sent.</h2>';
} else {
_("status").innerHTML = ajax.responseText;
_("mybtn").disabled = false;
}
}
}
ajax.send( formdata );
}
and here is my php code:
<?php
if( isset($_POST['n']) && isset($_POST['e']) && isset($_POST['m']) ){
$n = $_POST['n']; // HINT: use preg_replace() to filter the data
$e = $_POST['e'];
$m = nl2br($_POST['m']);
$to = "skoolboi434#gmail.com";
$from = $e;
$subject = 'Contact Form Message';
$message = '<b>Name:</b> '.$n.' <br><b>Email:</b> '.$e.' <p>'.$m.'</p>';
$headers = "From: $from\n";
$headers .= "MIME-Version: 1.0\n";
$headers .= "Content-type: text/html; charset=iso-8859-1\n";
if( mail($to, $subject, $message, $headers) ){
echo "success";
} else {
echo "The server failed to send the message. Please try again later.";
}
}
?>
As you can see I defined the function but getting that error. Any help would be greatly appreciated.
I'm not sure what I did so I started over and rewatched the tutorial a few times and got it to work.
The script below helps with processing of a form that request number and name values, and than sends it to process.php and also displays a confirmation and hides the button that would fired the modal to the form so user cannot retry to fill the form.
Script to handle pass data to process.php
$(document).ready(function () {
function successHandler(){
console.log('Success');
$("#thanks").html(msg);
$('#form-content').modal('hide');
}
function errorHandler(){
console.log('Error');
alert("Error");
}
var nameval = $('#name').val();
var numberval = $('#number').val();
$("form#contact").submit(function(){
$.ajax({
type: "POST",
url: "process.php",
data: {
name: nameval,
number: numberval,
submit: true
},
success: function(msg){
$("#thanks").html(msg);
$('#form-content').modal('hide');
return false;
},
error: function(){
alert("Error");
return false;
}
});
return false;
});
});
The whole action does generate an email with HTML from the process.php script but does not include the data that was captured from the form, I believe there is a error within this script as I cannot find anything on the form or process.php that is using PHPMail() doing anything wrong.
Could you help?
Update
<?php
if (isset($_POST['submit'])) {
$name = ($_POST['name']);
$number = ($_POST['number']);
echo "<span class=\"alert alert-success\">THANKS! SUBMITTED</span>";
$to = "EMAIL BLANKED";
$subject = "Alert!";
$message = "name: $name number: $number";
// Always set content-type when sending HTML email
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
// More headers
$headers .= 'From: <email blank>' . "\r\n";
mail($to,$subject,$message,$headers);
}
else { echo '<div class="alert alert-error">Error</div>' ; }
?>
You should put this two lines:
var nameval = $('#name').val();
var numberval = $('#number').val();
inside the submit function like this
$("form#contact").submit(function(){
var nameval = $('#name').val();
var numberval = $('#number').val();
because if you set the values of the variables before the submission of the form the inputs will most likely be empty.