Contact Form Problems (Red Border Validation) - php

I have been searching the web for two days for some sort of PHP template (because I do not know how to code in PHP) that could highlight a borders red if the user did not enter all the proper information. I manage to get the contact form working but not the way I want. Essentially, I need the user to enter proper information; if not, a red border appears.
Current Situation:
[Basic Contact Form: No Validation]
Desired Situation:
[Validating Contact Form]
*
Name (Required)(If Error: Red Border)
Email (Required: At least including the # sign)(If Error: Red Border)
Subject (Required)(If Error: Red Border)
Message (Required)(If Error: Red Border)
*
My site is: www.haildark.com, if you want to see it in its full detail. Please help if you can. I think my brain is about to implode again. Thank you. It does not have to be in PHP. As long as the code gets the job done, its perfectly fine with me.
HTML:
<!-- Contact -->
<div class="wrapper wrapper-style5">
<article id="contact" class="container small">
<header>
<h2>
Contact Us
</h2>
<span>
If you have any questions, comments, or concerns, please contact below and we will respond as soon as we can.
Please allow us at least 72 hours to respond. Thanks for supporting us.
</span>
</header>
<div>
<div class="row">
<div class="12u">
<form method="post" action="contact.php">
<div>
<div class="row half">
<div class="6u">
<input type="text" name="name" id="name" placeholder="Name" />
</div>
<div class="6u">
<input type="text" name="email" id="email" placeholder="Email" />
</div>
</div>
<div class="row half">
<div class="12u">
<input type="text" name="subject" id="subject" placeholder="Subject" />
</div>
</div>
<div class="row half">
<div class="12u">
<textarea name="message" id="message" placeholder="Message">
</textarea>
</div>
</div>
<div class="row">
<div class="12u">
<a href="#" class="button form-button-submit">
Send Message
</a>
<a href="#" class="button button-alt form-button-reset">
Clear Form
</a>
</div>
</div>
</div>
</form>
</div>
</div>
Basic PHP:
<?php
$field_name = $_POST['name'];
$field_email = $_POST['email'];
$field_subject = $_POST['subject'];
$field_message = $_POST['message'];
$mail_to = 'info#domain.com';
$subject = 'HailDark® User: '.$field_subject." - ".$field_name;
$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Subject: '.$field_subject."\n";
$body_message .= 'Message: '.$field_message;
$headers = 'From: '.$field_email."\r\n";
$headers = 'Reply To: '.$field_email."\r\n";
$mail_status = mail($mail_to, $subject, $body_message, $headers);
if ($mail_status) { ?>
<script language="javascript" type="text/javascript">
alert('Thank you for the message. We will contact you shortly.');
window.location = 'index.html';
</script>
<?php
}
else { ?>
<script language="javascript" type="text/javascript">
alert('Message failed. Please, send an email to info#domain.com');
window.location = 'index.html';
</script>
<?php
}
?>

I have seen that you are using HTML5 but not completely. You used:
<input type="text" name="email" id="email" placeholder="Email" />
You can use
<input type="email" name="email" id="email" placeholder="Email" required="required"/>
Html5 provides powerful way to manage your site like as the above line I used type="email" it automatically validates the email and also required="required" attribute provides you this field must not be empty it will highlighted you.
So use at first <!DOCTYPE html> before <html> tag and use html5 tags and use required="required" attribute for every tag where you want to validate the field.

<?php
if(empty($_POST['test'])) // other validation
{
$error = true;
}
?>
<input type="text" name='test' class='<?php echo ($error)?"red-border":"green-border"; ?>' />
<input type='submit' value='send' />
<style type="text/css">
.red-border{
border: 1px solid red;
}
.green-border{
border: 1px solid green;
}
</style>

Related

don't send the form message if input is empty

i do have a little problem with my contact.php :(
I needed for my page a contact form (very simple, just name, email and message).
It works perfectly but it sends the message even if the inputs are empty. My inputs do have "required" but it doesn't seem to work. My php skills are not that great. But you understand for sure where the problem is.
If there are empty fields, the form should not send the message and show an alert.
My current code:
HTML
<form method="post" id="myform" action="contact.php">
<div class="field half first">
<label for="name">Ihr Name</label>
<input type="text" name="name" id="name" required="required">
</div>
<div class="field half">
<label for="email">Ihre E-Mail</label>
<input type="text" name="email" id="email" required="required">
</div>
<div class="field">
<label for="message">Ihre Nachricht</label>
<textarea name="message" id="message" rows="5" required="required"></textarea>
</div>
<ul class="actions">
<li>
Senden
</li>
</ul>
</form>
contact.php
<?php
$field_name = $_POST['name'];
$field_email = $_POST['email'];
$field_message = $_POST['message'];
$mail_to = 'mail#gmail.com';
$subject = 'Nachricht von '.$field_name;
$body_message = 'Von: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Nachricht: '.$field_message;
$headers = 'Von: '.$field_email."\r\n";
$headers .= 'Antworte an: '.$field_email."\r\n";
$mail_status = mail($mail_to, $subject, $body_message, $headers);
if ($mail_status) { ?>
<script language="javascript" type="text/javascript">
alert('Ich bedanke mich für Ihre Nachricht. Bald werde ich Sie kontaktieren./ Thank you for your message.');
window.location = 'http://';
</script>
<?php
}
else { ?>
<script language="javascript" type="text/javascript">
alert('Senden fehlgeschlagen./ Could not send the message');
window.location = 'http://';
</script>
<?php
}
?>
Any ideas, how to fix that small problem? :(
I think if your goal is to prevent someone send a blank message/contact, just use "required" in the end of your input tag like this :
<input type="text" name="something" required/>
or in your case, it should be like this :
<form method="post" id="myform" action="contact.php">
<div class="field half first">
<label for="name">Ihr Name</label>
<input type="text" name="name" id="name" required>
</div>
<div class="field half">
<label for="email">Ihre E-Mail</label>
<input type="text" name="email" id="email" required>
</div>
<div class="field">
<label for="message">Ihre Nachricht</label>
<textarea name="message" id="message" rows="5" required></textarea>
</div>
<ul class="actions">
<li>
Senden
</li>
</ul>
</form>
The "required" is a simple html5 tag attribute that helps you prevent someone send a blank form. I hope it works on you, make sure you are working with html5.
There is a function in PHP called empty(). You can combine this with the $_POST function like this example:
<?php
// The form is submitted.
if(isset($_POST["submit_button"])) {
// Now check if the posted input element is empty, if empty stop by echo a error message
// Otherwhise continue executing script
if(empty($_POST["form_name"])) {
echo "You forgot to fill in this form-element.";
}else{
// Continue
}
}
?>
Read more about this function: http://php.net/manual/en/function.empty.php
Check if the form is submitted using isset() function:
isset — Determine if a variable is set and is not NULL
Then, check if the fields are filled using empty() function:
empty — Determine whether a variable is empty
// this will return true if the Submit Button is clicked
if(isset($_POST["submit_button"])) {
if(empty($_POST['name']) {
echo "Name is not filled";
} else if (empty($_POST['email']) {
echo "Email is not filled";
} else if (empty($_POST['message']) {
echo "Message is not filled";
} else {
// Your original code
}

Unable to get informations from a Html5 CSS and php form

I try to build a html5 form and send informations to form.php
<h3>Contact Me</h3>
<p></p>
<form method="post" action="form.php">
<div class="row uniform">
<div class="6u 12u(xsmall)">
<input type="text" name="name" id="name" placeholder="Name" />
</div>
<div class="6u 12u(xsmall)">
<input type="email" name="email" id="email" placeholder="Email" />
</div>
</div>
<div class="row uniform">
<div class="12u">
<input type="text" name="subject" id="subject" placeholder="Subject" />
</div>
</div>
<div class="row uniform">
<div class="12u">
<textarea name="message" id="message" placeholder="Message" rows="6"></textarea>
</div>
</div>
<div class="row uniform">
<div class="12u">
<ul class="actions">
<li>
<input type="submit" class="special" value="Send Message" />
</li>
<li>
<input type="reset" value="Reset Form" />
</li>
</ul>
</div>
</div>
</form>
At the same place I have form.php
<?
if (isset($_POST['name']) && isset($_POST['email'])) {
echo 'name '.$_POST['name'].' mail '.$_POST['email'];
}
?>
When I click on submit form.php page is open but blank.
<?php
if (isset($_POST['name']) && isset($_POST['email'])) {
echo 'name '.$_POST['name'].' mail '.$_POST['email'];
}
?>
I think you missed the opening of PHP tag its <?php and not <? .
Yes sorry, now I can send by mail.
<?php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = 'From: lespizz';
$to = 'jim#fdfrdsfg.com';
$subject = 'Hello';
$body = "From: $name\n E-Mail: $email\n Message:\n $message";
mail ($to, $subject, $body, $from)
?>
do you know how to get back on index.html automatically ?
Thanks
Using PHP you may redirect to another page with this code :
header("Location: index.html");
die();
But beware - it will work only if there was no output before!
Or if you have to give some output earlier you may just echo Javascript to redirect :
echo '<script type="text/javascript">
window.location = "http://www.google.com/"
</script>';

resetting form after php submit

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!

PHP Email Form Not Working

I'm having trouble to set this email form working properly
I have this contact.html:
<form mehtod="post" action="contact.php">
<hr />
<div class="row">
<div class="large-12 columns">
<label>Name
<input type="text" name="cf_name" placeholder="Name" />
</label>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Email
<input type="text" name="cf_email" placeholder="Email" />
</label>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Your message
<textarea name="cf_message" placeholder="Your message"></textarea>
</label>
</div>
</div>
<input class="button" type="reset" value="Clear">
<input class="button success expand" type="submit" value="Submit">
</form>
And this contact.php:
<?php
$field_name = $_POST['cf_name'];
$field_email = $_POST['cf_email'];
$field_message = $_POST['cf_message'];
$mail_to = 'my#email.com';
$subject = 'Personal Website Message from '.$field_name;
$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Message: '.$field_message;
$headers = 'From: '.$field_email."\r\n";
$headers .= 'Reply-To: '.$field_email."\r\n";
$mail_status = mail($mail_to, $subject, $body_message, $headers);
if ($mail_status) { ?>
<script language="javascript" type="text/javascript">
alert('Thank you for the message. I will contact you shortly.');
window.location = 'contact.html';
</script>
<?php
}
else { ?>
<script language="javascript" type="text/javascript">
alert('Message failed. There is a problem with your message, if keep aving trouble click on the Email me button above.');
window.location = 'contact.html';
</script>
<?php
}
?>
But when I upload this, and test it, nothing is sent to my email, why ? For me everything seems to be right ...
Your mail client may not be allowing sending emails without authorization. Unfortunately PHP's mail function does not support username + password authorization, so you have to look for third party extensions.
Please check the spelling of your 'method' attribute in the form element.
The PHP code you supplied specifies $_POST as the variable that contains data relevant to the form.
Your misspelling causes the server use the default 'get' method to post the data (for reference, see here)
Correcting the opening tag to the following should fix the issue:
<form method="post" action="contact.php">

why does this php contact form just download contact.php?

i'm a total n00b when it comes to PHP (and arguably, web development in general :/), but i've taken a look at a ton of examples, comparing my code, and i just can't figure it out. basically all thats happening is the contact.php file is just getting downloaded to my computer. ugh. also, this client did not ask for any field validation, which is why theres none there. help!!
heres my html-
<form action="contact.php" method="post">
<fieldset>
<legend><strong>Get A Quote!</strong>
</legend>
Call me at 555-555-5555, or email me at email#emaiul.com, or use the form below.<br /><br />
<div class="clearfix">
<div class="input">
<input style="width:370px; height:35px; font-size:14px;" value="Name" name="name" size="50" type="text">
</div>
</div><!-- /clearfix -->
<div class="clearfix">
<div class="input">
<input style="width:370px; height:35px; font-size:14px;" value="Email" name="email" size="50" type="text">
</div>
</div><!-- /clearfix -->
<div class="clearfix">
<div class="input">
<input style="width:370px; height:35px; font-size:14px;" value="Phone" name="phone" size="50" type="text">
</div>
</div><!-- /clearfix -->
<div class="clearfix">
<div class="input">
<textarea style="width:370px; height:55px; font-size:14px;" name="message" size="50" type="text">Message</textarea>
</div>
</div><!-- /clearfix -->
</fieldset>
<button type="submit" name="saveForm" style="background-image: url(static/img/btn-submit.png); width:150px; height:37px;"></button>
</form>
and the php-
<?php
if(isset($_POST['saveForm'])) {
$to = "steven#urethrafranklin.org";
$subject = "Inquiry from website";
$name_field = $_POST['name'];
$email_field = $_POST['email'];
$phone_field = $_POST['phone'];
$message = $_POST['message'];
$body = "From: $name_field\n E-Mail: $email_field\n Message:\n $message";
mail($to, $subject, $body);
} else {
echo "Sorry, something went wrong. Please email me at user#user.com.";
}
?>
Ah, you guys are all right.
tail -f /var/log/mail.log
was helpful.
And I am now using validate.js. Thanks guys!

Categories