Using contenteditable in an email form using jQuery/Javascript - php

I've taken a few scripts from elsewhere on the Stack to create a contact form that emails me when the user submits.
HTML:
<form onsubmit="return getContent()">
<fieldset>
<input name="name" value="NAME" style="max-width:15%" type="text"/>
<input name="email" value="EMAIL" style="max-width: 30%" type="text"/>
<div id="message" contenteditable="true" name="message" value="expanding textarea">HELLO</div>
<textarea id="my-textarea" value="MESSAGE" style="display:none"></textarea>
<input type="submit" style="margin-right:0" value="Submit" />
</fieldset>
</form>
SCRIPTS:
function getContent(){
document.getElementById("my-textarea").value = document.getElementById("message").innerHTML;
}
$('form').submit( function() {
$.ajax({
type: "POST",
url: "email.php",
data: $(this).serialize(),
success: function() {
// Update page with success message
}
});
return false;
});
PHP:
<?php
$recipient = "my.email#whatever.com"; //recipient
$Name = ($_POST['name']); //senders name
$email = ($_POST['email']); //senders e-mail adress
$mail_body = ($_POST['message']); //mail body
$header = "From: ". $Name . " <" . $email . ">\r\n"; //optional headerfields
mail($recipient, $subject, $mail_body, $header); //mail command :)
?>
The script SHOULD get the content entered in the contenteditable div and pass it through to the hidden textarea, then submit to my email. However, it's currently only passing through the "name" and "email" fields and leaving the body of the email blank.
What have I missed here?
EDIT: Made a small error in the code hidden textarea above, value="MESSAGE" not "SUBJECT". Still, code not working.

Contenteditable content doesn't get passed through the form when submitted.
But, it looks like you're using some JS to get the content of the editable content div and put it into the textarea with a name of "subject".
Therefore, it will be accessible through $_POST['subject'] only.
Also, you're doing an onsubmit="" in the html and a on submit in the JS file. I don't think both will work, you'd be better combining the two (i.e. just use the JS file).
It also won't work without JS enabled, which I'd say is a bigger problem.

Related

PHP Form Submission Sending Blank Emails

After manually submitting a form on my website, an email with the subject appears in my inbox. The email's subject is correctly sent as "Feedback Form Submission", but the email itself is blank. There is no body nor input from the email box on my form.
Form:
<form action="feedback-form.php" method="post" enctype="text/plain">
E-mail:<br>
<input type="text" class="textForm" name="email_address" size="35"><br>
Comment:<br>
<textarea name="feedback" class="textForm" rows="6" cols="35"></textarea><br><br>
<input type="submit" id="submit" class="button" value="Send">
</form>
PHP:
<?php
#Receive user input
$email_address = $_POST['email_address'];
$feedback = $_POST['feedback'];
#Filter user input for invalid characters
function filter_email_header($form_field)
{
return preg_replace('/[nr|!/<>^$%*&]+/', '', $form_field);
}
$email_address = filter_email_header($email_address);
#Send email
$headers = "From: $email_address";
$sent = mail('me#website.com', 'Feedback Form Submission', $feedback, $headers);
I believe my mail function is set up properly. My variables in the form match the variables my PHP script is using. My PHP and HTML are in the same file. I have read in other questions that having the two pieces of code in the same file can lead to issues when a blank form is submitted, but I am having issues while inputting valid information into my form. What am I doing incorrectly here?

PHP Form issues with action and echoing result

I am trying to get a simple two-field form to submit to an email address and then echo a "thanks for registering your interest" below the form (or instead of the form).
FYI, this is on a WordPress template file.
Here is the code, including the form:
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"
method="POST" autocomplete="on" id="register-form">
<input type="text" name="name" placeholder="Name"/>
<input type="email" name="email" placeholder="Email address"/>
<button type="submit" name="submit" class="button">Send
<img src="<?= get_image('icon-arrow-right-tiny.svg'); ?>"/></button>
</form>
<?php
if (isset($_POST['submit'])) {
// validate the email address first
$email = filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL);
// process the form only if the email is valid
if ($email) {
$to = 'info#example.com'; // where you want to send the mail
$from = 'info#mydomain.com';
$subject = 'Website Submission';
$message = 'Name: ' . $_POST['name'] . "\r\n\r\n";
$message .= 'Email Address: ' . $_POST['email'] . "\r\n\r\n";
$headers = "From: $from\r\nReply-to: $email";
$sent = mail($to, $subject, $message, $headers);
} ?>
<p style='color: #fff; font-size: 14px;'>Thank you for registering your interest.</p>
<?php
}
?>
At the present time, the form does get sent, and the page does echo "Thank you for registering your interest" underneath the form, however it does not seem to be returning us to the correct page when you click the submit button.
Any ideas?
Thank you for all of your contributions. I have worked out the problem, and will share here for anybody else who comes here to find the answer.
WordPress has something important reserved for the "name" parameter, and thus you can't use it in PHP-based forms. Changing the parameter name from "name" to something else resolved the issue.
Additionally, WordPress also has the following names reserved and you cannot use them in forms - "day" "month" and "year".
I have check your code i think you have use color code #fff i.e. for the message.
Please try to make black or any other color rest of code are working.
:)
Thank you for registering your interest.
You have to put a php code below your Thank you message.
header("location:$_SERVER["PHP_SELF"]);exit;

PHP mail() Sending 2 Emails instead of 1 [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I've got a form I have created that is just a simple form with a text box and submit button. The text box is for an email address that an email will be sent to.
Here's my code:
//Get First Name Value
if($is_logged_id && isset($user_data['FirstName'])) $first_name = $user_data['FirstName'];
//Get Last Name Value
if($is_logged_id && isset($user_data['LastName'])) $last_name = $user_data['LastName'];?>
<?php
//Get Phone Number
if($is_logged_id && isset($user_data['Phones'][0]->Number)) $phone_number = $user_data['Phones'][0]->Number;?>
<?php
//Get Last 4 digits of phone number
$last_four = substr($phone_number, -4);
//Add Phone Number to last name
$ref_code = $last_name . $last_four;
?>
<?php
//if "email" variable is filled out, send email
if (isset($_REQUEST['refemail'])) {
$email_from = $first_name . $last_name . "<" . $user_data['EmailAddress'] . ">";
// Headers
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= 'From: ' . $email_from . "\r\n";
//Email information
$refemail = $_REQUEST['refemail'];
$subject = $first_name;
//send email
mail($refemail, $first_name , $refcode , $headers);
//Email response
echo "<p style='padding: 10px;'>Email Response</p>";
}
//if "email" variable is not filled out, display the form
else {
?>
<form method="post">
<label for="refemail" class="control-label col-sm-3 col-md-3 col-xs-12 text-left ">Email Address:</label>
<div class="form-group"></div>
<input name="refemail" type="text" size="50" class="form-control" /><br />
<input type="submit" class="ref-btn" value="Submit" />
</div>
</form>
<?php
}
?>
Everything is working exactly the way I want it to, except it is sending two emails that are exactly the same instead of just one. I've done some searching around and I can't find anything that solves my problem.
I've tried adding the following below the mail() function:
exit("sent");
It still sends two emails.
Is there something wrong with my code or could this be an issue with my host?
Thanks.
I guess the form submit twice, after you refresh the page or you submit the form then refresh.
Here echo "<p style='padding: 10px;'>Email Response</p>";, if refresh, here you will see just one 'Email Response'.
Here is to prevent the refresh submit(Jquery):
$('#form').submit(function(e){
e.preventDefault();
//then do the submit.
});
Or
you can just replace button type for testing
<button type="button">
---------------------------------------------------------
Example of Ajax Post data:
In the form.php:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" id='form'>
<label for="refemail" class="control-label col-sm-3 col-md-3 col-xs-12 text-left ">Email Address:</label>
<input name="refemail" id='refemail' type="text" size="50" class="form-control" /><br />
<input type="submit" class="ref-btn" value="Submit" />
</form>
<script>
$(function(){
$('#form').submit(function(e){
e.preventDefault();
data = {
refemail: $('#refemail').val(),
};
$.ajax({
type: "POST",
url: './sendemail.php',
dataType: "html",
timeout: 50000,
data: data,
success: function(data) {
alert(data);
},
error: function(request, status, err) {}
});
});
});
</script>
In the sendemail.php:
<?php
if(isset($_REQUEST['refemail'])){
echo $_REQUEST['refemail'];
//here do the send email
}else{
echo 'No email';
}
?>

Javascript Form Submit with Email Action?

I need make this form send me a email like a contact form:
Script code:
<script type="text/javascript">
$(document).ready(function(){
$("#contactLink").click(function(){
if ($("#contactForm").is(":hidden")){
$("#contactForm").slideDown("slow");
}
else{
$("#contactForm").slideUp("slow");
}
});
});
function closeForm(){
$("#messageSent").show("slow");
setTimeout('$("#messageSent").hide();$("#contactForm").slideUp("slow")', 2000);
}
</script>
HTML CODE:
<div class="box">
<div id="contactFormContainer">
<div id="contactForm">
<fieldset>
<label for="Name">Nome: </label>
<input id="name" type="text" />
<label for="Telefone">Telefone Fixo: </label>
<input type="text" id="phone" maxlength="15" onkeypress="Mascara(this);" />
<label for="Message">Assunto:</label>
<textarea id="Message" rows="3" cols="20"></textarea>
<input id="sendMail" type="submit" name="submit" onclick="closeForm()" />
<span id="messageSent">Sua solicitação foi enviada com sucesso, por favor, aguarde...</span>
</fieldset>
</div>
<div id="contactLink"></div>
</div>
When click and close the form i need send me a email with the content of form, how to?
Some idea? thanks!
Firstly i can't see the form tags in your code. According to me you're doing this wrong and i'm sure many of our friends on stack will agree too.
Your question suggests that you basically want to receive an email with the data submitted through the form. Why don't you try the below method.
HTML
<form action="mail.php" method="POST">
<input type="text" name="fname"></input>
<input type="text" name="lname"></input>
<button>SUBMIT</button>
</form>
PHP
<?php
$firstname = $_POST['fname'];
$lastname = $_POST['lname'];
$to = "someone#example.com";
$subject = "Hello World";
$message = "Firstname: $firstname \n\n Lastname: $lastname";
$from = "sender#example.com";
$headers = "From:" . $from;
mail($to,$subject,$message,$headers);
echo "Mail Sent.";
?>
The above example is the most simplest method of sending an email. You can go advance by adding more header information and graphically formatting the email.
Go through these tutorials if you get confused.
http://www.w3schools.com/php/php_mail.asp
http://www.phpeasystep.com/phptu/8.html
And since you mentioned that you want to perform the task via javascript you can try submitting the form via ajax, refer the below tutorials
http://teachingyou.net/php/simple-php-contact-form-using-ajax/
http://www.sitepoint.com/forums/showthread.php?1055068-Send-PHP-email-using-jQuery-AJAX
Since you've tagged the question php, have a look at php's mail function. http://php.net/manual/en/function.mail.php
$to = 'you#domain.com';
$subject = 'Contact Form';
$message = '...' //concatenate the $_POST (or $_GET) variables to create this message
mail($to, $subject, wordwrap($message, 70, "\r\n");
This function requires that your server has a properly configured to send mail - see the php documentation for requirements: http://www.php.net/manual/en/mail.requirements.php

Do not understand why my Contact Form isn't sending emails

I am trying to make a email send in a pop up on my site that you can see with the link below:
http://www.madaxedesign.co.uk
However it redirects perfectly to the thank you message however after it has redirected it does not implement the PHP. Below I have shown the PHP, HTML and Jquery used for this contact form.
HTML:
<form id="submit_message" class="hide_900" action="/send.php" method="post">
<div id="NameEmail">
<div>
<label for="name">Name*</label>
<input type="text" title="Enter your name" name="name"/>
</div>
<div>
<label for="email">Email*</label>
<input type="text" title="Enter your email address" name="email"/>
</div>
</div>
<div id="MessageSubmit">
<div>
<textarea maxlength="1200" title="Enter your message" name="message"></textarea>
<label for="message">Message</label>
</div>
<div class="submit">
<input type="submit" value="Submit"/>
</div>
</div>
</form>
PHP:
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$formcontent="From: $name \n Message: $message";
$recipient = "maxlynn12#gmail.com";
$subject = "Email From Madaxe";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
header('Location: /thanks.html');
exit();
?>
Jquery:
$('form#submit_message').live('submit', function() {
$('#popup').load('/thanks.html');
return false;
});
I was wondering if anyone could quickly look and see if I am missing anything obvious that I can quickly fix or even point me in the right direction.
Thanks
Your jQuery is interfering.
I think this might help, using AJAX to post your form: jQuery Ajax POST example with PHP
You do not need to your jquery code. actually it prevents your default action form action=send.php. and it does not pass your inputs to send.php
$.live() is deprecated in jQuery 1.9 and that's what you appear to be using. Please either downgrade or use an alternative function like .submit().
$('#submit_message').submit(function (e) {
e.preventDefault();
$('#popup').load('/thanks.html');
}
Also, it is crucial that you sanitise your $_POST inputs before using them for your e-mail headers, otherwise a hacker can inject bad things into your headers.
if you are trying to send mail through localhost you need to change some setting in php.ini file. Refer below link to do this.
http://blog.techwheels.net/send-email-from-localhost-wamp-server-using-sendmail/

Categories